In this exercise, we add a new feature to Shindig. I may have jacked-in at the wrong place – but this will get you started.
First we move into the feature directory:
cd features/src/main/javascript/features
Create a new directory named learning and put three files into it.
learning_client.js
gadgets['learning'] = (function() { return { getContextLabel : function() { return 'SI124'; }, getContextName : function() { return 'Social Computing'; }, setOutcome : function(data) { alert('setOutcome belongs here'); } }; })();
This creates our client code and defines three methods in the client. For now they are simple stubs to keep life simple.
taming.js
var tamings___ = tamings___ || []; tamings___.push(function(imports) { ___.grantRead(gadgets.learning, 'getContextLabel'); ___.grantRead(gadgets.learning, 'getContextName'); ___.grantRead(gadgets.learning, 'setOutcome'); });
I am a little foggy on this file – it basically works with Caja to make sure that you are explicit as to what you want to really expose to JavaScript callers.
feature.xml
<feature> <name>learning</name> <dependency>globals</dependency> <gadget> <script src="learning_client.js"/> <script src="taming.js"/> </gadget> <container> <script src="learning_client.js"/> <script src="taming.js"/> </container> </feature>
This file names your feature and defines the source files that make it up.
Then edit the file features.txt and add a line:
features/xmlutil/feature.xml features/com.google.gadgets.analytics/feature.xml features/learning/feature.xml
There is a way to do this using a script, but for now, lets just jack-in directly.
At this point you need to rebuild Shindig. And you might get syntax errors during the build which you need to fix. Somehow the Javascript for features is compiled / processed at mvn time and put into a more run-time format.
mvn
once it compiles and installs, start Jetty again
mvn -Prun
And navigate to http://localhost:8080/samplecontainer/samplecontainer.html
You should see the “Social Hello World” gadget. Now lets edit this file:
vi ./target/work/webapp/samplecontainer/examples/SocialHelloWorld.xml
And add two lines:
<Require feature="osapi"></Require> <Require feature="learning"></Require> <Require feature="settitle"/></Require> … gadgets.window.setTitle('Social Hello World'); alert(gadgets.learning.getContextLabel()); var hellos = new Array('Hello World', 'Hallo Welt', 'Ciao a tutti', ...
This requests that the container load the new learning feature and then we call the learning feature when the JavaScript starts up in the gadget and you should see the dialog box pop up once you save the SampleHelloworld.xml and do a refresh.