You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@shindig.apache.org by rb...@apache.org on 2012/01/09 15:30:07 UTC
svn commit: r1229170 - in
/shindig/trunk/content/samplecontainer/examples/commoncontainer:
assembler.js cconviews.js index.html viewController.js
Author: rbaxter85
Date: Mon Jan 9 14:30:06 2012
New Revision: 1229170
URL: http://svn.apache.org/viewvc?rev=1229170&view=rev
Log:
Committed For Matt Marum
SHINDIG-1675
Add support for Embedded Experience Gadgets in the CommonContainer test environment
Modified:
shindig/trunk/content/samplecontainer/examples/commoncontainer/assembler.js
shindig/trunk/content/samplecontainer/examples/commoncontainer/cconviews.js
shindig/trunk/content/samplecontainer/examples/commoncontainer/index.html
shindig/trunk/content/samplecontainer/examples/commoncontainer/viewController.js
Modified: shindig/trunk/content/samplecontainer/examples/commoncontainer/assembler.js
URL: http://svn.apache.org/viewvc/shindig/trunk/content/samplecontainer/examples/commoncontainer/assembler.js?rev=1229170&r1=1229169&r2=1229170&view=diff
==============================================================================
--- shindig/trunk/content/samplecontainer/examples/commoncontainer/assembler.js (original)
+++ shindig/trunk/content/samplecontainer/examples/commoncontainer/assembler.js Mon Jan 9 14:30:06 2012
@@ -37,6 +37,7 @@ shindig.auth.updateSecurityToken('john.d
// Need to pull these from values supplied in the dialog
CommonContainer.init = function() {
+
//Create my new managed hub
CommonContainer.managedHub = new OpenAjax.hub.ManagedHub({
onSubscribe: function(topic, container) {
@@ -94,6 +95,7 @@ CommonContainer.renderGadget = function(
return gadgetSite;
};
+
//TODO: To be implemented. Identify where to hook this into the page (in the gadget title bar/gadget management, etc)
CommonContainer.navigateView = function(gadgetSite, gadgetURL, view) {
var renderParms = {};
@@ -108,7 +110,7 @@ CommonContainer.navigateView = function(
};
//TODO: Add in UI controls in portlet header to remove gadget from the canvas
-CommonContainer.colapseGadget = function(gadgetSite) {
+CommonContainer.collapseGadget = function(gadgetSite) {
CommonContainer.closeGadget(gadgetSite);
};
Modified: shindig/trunk/content/samplecontainer/examples/commoncontainer/cconviews.js
URL: http://svn.apache.org/viewvc/shindig/trunk/content/samplecontainer/examples/commoncontainer/cconviews.js?rev=1229170&r1=1229169&r2=1229170&view=diff
==============================================================================
--- shindig/trunk/content/samplecontainer/examples/commoncontainer/cconviews.js (original)
+++ shindig/trunk/content/samplecontainer/examples/commoncontainer/cconviews.js Mon Jan 9 14:30:06 2012
@@ -40,6 +40,7 @@ CommonContainer['views'] = CommonContain
CommonContainer.views.createElementForGadget = function(gadgetMetadata,
opt_view, opt_viewTarget) {
+
var surfaceView = 'default';
var viewTarget = 'default';
@@ -66,6 +67,7 @@ CommonContainer.views.createElementForGa
};
+
/**
* Method will be called to create the DOM element to place the UrlSite in.
*
Modified: shindig/trunk/content/samplecontainer/examples/commoncontainer/index.html
URL: http://svn.apache.org/viewvc/shindig/trunk/content/samplecontainer/examples/commoncontainer/index.html?rev=1229170&r1=1229169&r2=1229170&view=diff
==============================================================================
--- shindig/trunk/content/samplecontainer/examples/commoncontainer/index.html (original)
+++ shindig/trunk/content/samplecontainer/examples/commoncontainer/index.html Mon Jan 9 14:30:06 2012
@@ -19,22 +19,23 @@
-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
-
+ <title>OpenSocial Common Container Test Environment</title>
<!-- My OpenSocial Beginnings -->
- <link rel="stylesheet" href="../../../container/gadgets.css">
+ <link rel="stylesheet" href="../../../container/gadgets.css"/>
+
<script type="text/javascript" src="../../../gadgets/js/container:open-views:opensearch:rpc:pubsub-2.js?c=1&debug=1&container=default"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
- <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
<link rel="stylesheet"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/cupertino/jquery-ui.css"
type="text/css" media="all"/>
+ <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
<script type="text/javascript" src="./assembler.js"></script>
<script type="text/javascript" src="./viewController.js"></script>
<script type="text/javascript" src="./layout.js"></script>
<script type="text/javascript" src="./cconviews.js"></script>
<script type="text/javascript" src="./search.js"></script>
- <style>
+ <style type="text/css">
.portlet-header .ui-icon { float: right; }
#content {
display: table;
@@ -88,17 +89,25 @@
border: 1px solid blue;
}
+ .widerInput {
+ width: 270px;
+ }
+
</style>
</head>
-<body onLoad="CommonContainer.init();">
+<body onload="CommonContainer.init();">
+
+
+
+
<!-- Need to add in an improved header with links to specification -->
<a href="http://www.opensocial.org/">
- <img alt="OpenSocial" src="http://api.ning.com/files/chwE7fbkJ5D1q8NSzNCYJzzCqOiuo3xYyToZCsYuY0SViOKQ7EG-3UUv4KFSxOMACbIzs3oWtD076*cbEL-*ABd9hCO0p7Al/opensocialsitelogo1.png?width=288&height=70&xn_auth=no&type=png">
+ <img alt="OpenSocial" src="http://api.ning.com/files/chwE7fbkJ5D1q8NSzNCYJzzCqOiuo3xYyToZCsYuY0SViOKQ7EG-3UUv4KFSxOMACbIzs3oWtD076*cbEL-*ABd9hCO0p7Al/opensocialsitelogo1.png?width=288&height=70&xn_auth=no&type=png"/>
</a>
<span style="float:right">
<input type="text" id="query"/>
- <button name="search" id="searchButton" onClick="updateSearchURLs()">Search</button>
+ <button name="search" id="searchButton" onclick="updateSearchURLs()">Search</button>
<br/><span id="engineList"></span>
</span>
@@ -115,40 +124,70 @@
<div>
- Enter the gadget url (ex.
+ <p>Enter the gadget url (ex.
http://localhost:8080/samplecontainer/examples/SocialHelloWorld.xml) and select 'Add' to
- render the gadget
- <br/>
- <input type="text" name="gadgetUrl" id="gadgetUrl"
- class="text ui-widget-content ui-corner-all"/>
+ render the gadget</p>
- <button id="addGadget">Add</button>
- <br/>
- <br/>
- -OR-
- <br/>
- <br/>
+ <div style='display: block;'>
+ <input type="text" name="gadgetUrl" id="gadgetUrl"
+ class="text ui-widget-content ui-corner-all"/>
+ <button id="addGadget">Add</button>
+ </div>
+ <p>-OR-</p>
+ <p>
Pick from one of the collections and select Add Gadgets to render the associated gadgets
- <br/>
- <select id="gadgetCollection"> </select>
- <button id="addGadgets">Add Gadgets</button>
+ </p>
+ <div style='display: block;'>
+ <select id="gadgetCollection"> </select>
+ <button id="addGadgets">Add Gadgets</button>
+ </div>
</div>
<h3><a href="#">Container Events</a></h3>
<div>
+ <p>
Enter the event topic (ex. org.opensocial.container.event.sampleevent)
- <br/>
+ </p>
+
<input type="text" name="eventTopic" id="eventTopic"
class="text ui-widget-content ui-corner-all"/>
- <br/>
+ <p>
Enter the event payload
- <br/>
- <textarea type="text" name="eventPayload" id="eventPayload"
- class="text ui-widget-content ui-corner-all"> </textarea>
- <br/>
- <button id="pubEvent">Publish</button>
+ </p>
+ <div style='display: block;'>
+ <textarea name="eventPayload" id="eventPayload"
+ class="text ui-widget-content ui-corner-all"> </textarea>
+ <button id="pubEvent">Publish</button>
+ </div>
+ </div>
+ <h3><a href="#">Embedded Experience Gadgets</a></h3>
+
+ <div>
+ <div style='display: block; padding-bottom: 5px'>
+ Enter the embedded experience gadget URL
+ </div>
+ <div style='display: block; padding-bottom: 10px'>
+ <input type="text" name="eeUrl" id="eeUrl"
+ class="text ui-widget-content ui-corner-all widerInput"/>
+ </div>
+
+ <div style='display: block; padding-bottom: 5px;'>
+ <label style='display: inline-block; width: 75px;' for="eeHeight">Height: </label>
+ <input type="text" name="eeHeight" id="eeHeight" class="text ui-widget-content ui-corner-all" value="400"></input>
+ </div>
+ <div style='display: block; padding-bottom: 10px;'>
+ <label style='display: inline-block; width: 75px;' for="eeWidth">Width: </label>
+ <input type="text" name="eeWidth" id="eeWidth" class="text ui-widget-content ui-corner-all" value="640"></input>
+ </div>
+
+ <p>
+ Enter the context as a JSON String, and select 'Add' to render the embedded experience gadget
+ </p>
+ <textarea name="eecontextPayload" id="eecontextPayload"
+ class="text ui-widget-content ui-corner-all widerInput"> </textarea>
+ <p><button id="addEmbeddedExperience">Add</button></p>
</div>
</div>
<span class="ui-icon ui-icon-grip-dotted-horizontal" style="margin: 2px auto;"></span>
Modified: shindig/trunk/content/samplecontainer/examples/commoncontainer/viewController.js
URL: http://svn.apache.org/viewvc/shindig/trunk/content/samplecontainer/examples/commoncontainer/viewController.js?rev=1229170&r1=1229169&r2=1229170&view=diff
==============================================================================
--- shindig/trunk/content/samplecontainer/examples/commoncontainer/viewController.js (original)
+++ shindig/trunk/content/samplecontainer/examples/commoncontainer/viewController.js Mon Jan 9 14:30:06 2012
@@ -21,6 +21,12 @@ $(function() {
// Input field that contains gadget urls added by the user manually
var newGadgetUrl = $('#gadgetUrl');
+ // Input fields that contains EE gadget URL and EE context
+ var eeUrl = $('#eeUrl');
+ var eecontextPayload = $('#eecontextPayload');
+ var eeHeight = $('#eeHeight');
+ var eeWidth = $('#eeWidth');
+
// Input fields for container event testing
var newEventTopic = $('#eventTopic');
var newEventPayload = $('#eventPayload');
@@ -29,7 +35,7 @@ $(function() {
var gadgetTemplate = '<div class="portlet">' +
'<div class="portlet-header">sample to replace</div>' +
'<div id="gadget-site" class="portlet-content"></div>' +
- '</div>';
+ '</div>';
//variable to keep track of gadget current view for collapse and expand gadget actions.
var currentView = 'default';
@@ -87,7 +93,7 @@ $(function() {
//navigate to currentView prior to colapse gadget
CommonContainer.navigateView(gadgetSite, gadgetURL, currentView);
}else if (actionId === 'collapse') {
- CommonContainer.colapseGadget(gadgetSite);
+ CommonContainer.collapseGadget(gadgetSite);
}
}
};
@@ -98,14 +104,13 @@ $(function() {
$('#' + titleId).text(title);
};
- //create a gadget with navigation tool bar header enabling gadget collapse, expand, remove, navigate to view actions.
- buildGadget = function(result,gadgetURL) {
+ getNewGadgetElement = function(result, gadgetURL){
var gadgetSiteString = "$(this).closest(\'.portlet\').find(\'.portlet-content\').data(\'gadgetSite\')";
var viewItems = '';
var gadgetViews = result[gadgetURL].views;
for (var aView in gadgetViews) {
- viewItems = viewItems + '<li><a href="#" onclick="navigateView(' + gadgetSiteString + ',' + '\'' + gadgetURL + '\'' + ',' + '\'' + aView + '\'' + '); return false;">' + aView + '</a></li>';
- }
+ viewItems = viewItems + '<li><a href="#" onclick="navigateView(' + gadgetSiteString + ',' + '\'' + gadgetURL + '\'' + ',' + '\'' + aView + '\'' + '); return false;">' + aView + '</a></li>';
+ }
var newGadgetSite = gadgetTemplate;
newGadgetSite = newGadgetSite.replace(/(gadget-site)/g, '$1-' + curId);
siteToTitleMap['gadget-site-' + curId] = 'gadget-title-' + curId;
@@ -124,15 +129,20 @@ $(function() {
'</ul>')
.append('<span id="remove" class="ui-icon ui-icon-closethick"></span>')
.append('<span id="expand" class="ui-icon ui-icon-plusthick"></span>')
- .append('<span id="collapse" class="ui-icon ui-icon-minusthick"></span>')
- .end()
- .find('.portlet-content')
- .data('gadgetSite', CommonContainer.renderGadget(gadgetURL, curId));
+ .append('<span id="collapse" class="ui-icon ui-icon-minusthick"></span>');
+
+ return $('#gadget-site-'+curId).get([0]);
+ }
+
+ //create a gadget with navigation tool bar header enabling gadget collapse, expand, remove, navigate to view actions.
+ buildGadget = function(result,gadgetURL){
+ var element = getNewGadgetElement(result, gadgetURL);
+ $(element).data('gadgetSite', CommonContainer.renderGadget(gadgetURL, curId));
//determine which button was click and handle the appropriate event.
$('.portlet-header .ui-icon').click(function() {
handleNavigateAction($(this).closest('.portlet'), $(this).closest('.portlet').find('.portlet-content').data('gadgetSite'), gadgetURL, this.id);
- });
+ });
};
// Publish the container event
@@ -186,5 +196,30 @@ $(function() {
});
+ $('#addEmbeddedExperience').click(function(){
+ CommonContainer.preloadGadgets(eeUrl.val(), function(result) {
+ for (var gadgetURL in result) {
+ if(!result[gadgetURL].error) {
+ var eeElement = getNewGadgetElement(result, gadgetURL);
+
+ var model = new Object();
+
+ model.context = gadgets.json.parse(eecontextPayload.val());
+ model.gadget = gadgetURL;
+
+ var params = [];
+ params[osapi.container.ee.RenderParam.GADGET_RENDER_PARAMS] = {
+ 'height' : eeHeight.val(),
+ 'width' : eeWidth.val(),
+ };
+ var currentEESite = CommonContainer.ee.navigate(eeElement, model, params, null);
+ curId++;
+ }
+ }
+ });
+
+ return true;
+ });
+
});