A ROLE Developer Workshop held at Dev8eD 2012 in Birmingham, UK. To all participants: thank you for coming! Resources used in the workshop: http://dbis.rwth-aachen.de/gadgets/dev8ed/
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Currently happening: significant shift in education From lecture to interactive (online) group work Learners, not institutions, own the education defining their lives Online learning tools cherry-picked or handcrafted by educators & learners DIY motto “create, disassemble, repurpose“ applied to educational products Learners & educators create mash-up learning apps, lessons & processes
More interaction, personalization, freedom, ownership More enjoyable, appealing, effective learning
For any resource open index page with <RESOURCE_URI>/:index
OpenApp – Store Custom User Data (e.g. Personal Notes)
1. In the HTML Section create UI elements to store a note.<input type="text" id="note" /><button onclick="storeNote()">Store</button>
2. Create a function storeNote storing the notefunction storeNote(){ var note = {"text":document.getElementById("note").value}; space.create({ relation: openapp.ns.role + "data", type: "my:ns:note", representation: note, callback: function(sub){window.location.reload();} });}
Done!Your widget can store notes as shared space data . Now read custom user data…
OpenApp – Read Custom User Data (e.g. Shared Notes)
1. In the HTML Section create a UI list to display all notes.<ul id="notes"/>
2. Create a function renderNotes rendering all notes as list items. function renderNotes(){ space.getSubResources({ relation: openapp.ns.role + "data", type: "my:ns:note", onEach: function(note) { note.getRepresentation("rdfjson",function(r){ var ne = document.createElement("li"); var ntext = document.createTextNode(r.text); ne.appendChild(ntext); document.getElementById("notes").appendChild(ne); }); } });}
3. Call function renderNotes on widget initialization.
Done! But how to make other space members aware of changes?
Widget Programming with ROLE APIsHow to make your widget communicate in real-time – The ROLE Interwidget Communication (IWC) API
Connects the client to local interwidget communication. After successful call, the client is able to publish and receive intents. Received intents are passed to the callback function.
disconnect() Disconnects the client from interwidget communication.
publish(intent) Publishes a JSON-encoded intent.
Initialize ROLE IWC Client
var iwcClient = new iwc.Client(); iwcClient.connect(function(intent){
Google Android-like Intents component(*) (String) - the component name of a specific recipient widget
(explicit intent) or the empty string to indicate broadcasting (implicit intent) sender (String) - sender & sender widget. action (String) - the action to be performed by receivers (e.g. ACTION_UPDATE) data(*) (String) - data in form of a URI (e.g. http://myresource.org/microblogs/1) dataType(*) (String) - the data type in MIME notation (e.g. text/html) categories (Array) - categories of widgets to process the intent (e.g. ["editor"]) flags (Array) - flags controlling intent processing (e.g. ["PUBLISH GLOBAL"]) extras (JSON) - auxiliary data (e.g. {"examplekey":"examplevalue“})