Your SlideShare is downloading. ×
0
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Getting the Most Out of OpenSocial Gadgets
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Getting the Most Out of OpenSocial Gadgets

1,542

Published on

Published in: Technology, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,542
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
26
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • • Designed & built for sharing content between heterogenous apps • This is exactly what it’s used for in iGoogle, and exactly what it’s used for in OpenSocial
  • • Open standard • Based on other emerging standards • Portable Contacts • OAuth • Basic web technology like HTML, CSS, & JavaScript • Substantial industry support • Social networks • Increasingly, among business and enterprise-oriented vendors • These are the better-known companies, but the list keeps growing • Also support from the open source world
  • • OpenSocial Gadgets spec defines three main parts • <click> XML spec file: description of everything that makes up your gadget • Metadata, such as the title & directory information • Content that fills the gadget iframe • Can be hosted on any web server • Gadget containers can be configured with a list of gadget spec URLs • Fetch the gadget spec XML to render or display in the directory • To avoid too much HTTP traffic, containers cache specs • Spec file needs to be more or less static • If it changes on each request, users won’t see those changes • To make the gadget do something interesting, use JavaScript • Inline or with a link to an external script file • <click> JavaScript makes use of the core gadgets JavaScript API • Automatically made available to all gadgets • Access configurable preferences • Make requests to web services • <click> Features: gadgets can use them by declaring them in spec • Additional capabilities for gadgets • Often new APIs that the gadget can call in its JavaScript code • Can provide UI features: tabs or banners • Can provide container integration features: resizing or renaming • Some are defined in the spec, but may not be provided by all containers, others are container specific • We use a custom feature to let us know which directory categories a gadget should be included in • Gadgets can decide to require the feature • Won’t work in containers that don’t provide it • Or make it optional • Gadget must test for feature before using it
  • Transcript

    • 1.  
    • 2. Getting the most out of OpenSocial gadgets <ul><li>Mark Halvorson </li></ul><ul><li>Director of Interactive Marketing, Atlassian </li></ul><ul><li>Board Member, OpenSocial Foundation </li></ul><ul><li>[email_address] , @halv0112 </li></ul>
    • 3. Agenda <ul><li>What it is a Gadget </li></ul><ul><li>Why Atlassian chose OpenSocial </li></ul><ul><li>Why you should too! </li></ul>
    • 4. What is OpenSocial?
    • 5. Social Data Model
    • 6. Web Service APIs
    • 7. Gadgets
    • 8. Our Problem
    • 9. Before <ul><li>Enterprise Apps are Silos </li></ul>FishEye Source Code JIRA Issues & Tasks Confluence Wiki
    • 10. Emphasize Teams, Projects & Tasks over Tools
    • 11. Too Many Dashboards
    • 12. Cross-Product Sharing
    • 13. Integration <ul><li>with non-Atlassian apps </li></ul>
    • 14. Solution: OpenSocial Gadgets
    • 15. Gadgets <ul><li>are a Great Solution for Dashboards </li></ul>
    • 16. After <ul><li>Open standard for enterprise application connection </li></ul>view complete project single activity stream comment & interact
    • 17. Managers Do Email <ul><li>Not just about portals, or internal applications. </li></ul>view activity & status create issues
    • 18.
    • 19. Why Write Gadgets? <ul><li>They’re easy! </li></ul><ul><li>They use stable, widely accessible and understood technologies </li></ul><ul><li>Write once, display in multiple containers </li></ul>
    • 20. The Hello World Example
    • 21. Anatomy of a Gadget <ul><li>XML Spec File </li></ul><ul><ul><li>Metadata, HTML Content, and JavaScript </li></ul></ul><ul><li>Core JavaScript API </li></ul><ul><ul><li>Access Preferences, Make Requests </li></ul></ul><ul><li>Gadget Features </li></ul><ul><ul><li>Additional, Optional Capabilities & APIs </li></ul></ul>
    • 22. XML Spec File
    • 23. <ModulePrefs> <?xml version= &quot;1.0&quot; encoding= &quot;UTF-8&quot; ?> <Module> <ModulePrefs title= &quot;JIRA Issues&quot; author= &quot;Atlassian&quot; thumbnail= &quot; http://labs.atlassian.com/svn/GADGETS/trunk/jira-issues/basic/jira-issues-thumbnail.png &quot; description= &quot;A list of recently created Issues&quot; > <Require feature= &quot;minimessage&quot; /> <Require feature= &quot;dynamic-height&quot; /> </ModulePrefs>
    • 24. <UserPref> <UserPref name= &quot;show_date&quot; display_name= &quot;Show Dates?&quot; datatype= &quot;bool&quot; default_value= &quot;true&quot; /> <UserPref name= &quot;show_summ&quot; display_name= &quot;Show Summaries?&quot; datatype= &quot;bool&quot; default_value= &quot;true&quot; /> <UserPref name= &quot;num_entries&quot; display_name= &quot;Number of Entries:&quot; default_value= &quot;5&quot; required= &quot;true&quot; />
    • 25. <Content> <Content type= &quot;html&quot; > <![CDATA[ <link rel= &quot;stylesheet&quot; href= &quot; http://labs.atlassian.com/svn/GADGETS/trunk/jira-issues/basic/jira-issues.css &quot; > <div id= &quot;content_div&quot; ></div> <script type= &quot;text/javascript&quot; src= &quot; http://labs.atlassian.com/svn/GADGETS/trunk/jira-issues/basic/jira-issues.js &quot; ></script> ]]> </Content> </Module>
    • 26. Views - DEFAULT view
    • 27. Views - DEFAULT view
    • 28. Views - CANVAS view
    • 29. Views - DEFAULT view (Gmail)
    • 30. Views - CANVAS view (Gmail)
    • 31. Inline Contextual Gadget +
    • 32. Views - Custom view
    • 33. Wallboards <ul><li>Gadgets go beyond the JIRA Dashboard onto your wall! </li></ul>
    • 34. Wallboard – Default View
    • 35. Wallboard – Wallboard View
    • 36. JavaScript // Create minimessage factory var msg = new gadgets.MiniMessage(); // Show a small loading message to the user var loadMessage = msg.createStaticMessage( &quot;loading...&quot; ); // Get configured user prefs var prefs = new gadgets.Prefs(); var showDate = prefs.getBool( &quot;show_date&quot; ); var showSummary = prefs.getBool( &quot;show_summ&quot; ); var numEntries = prefs.getInt( &quot;num_entries&quot; ); // Fetch issues when the gadget loads gadgets.util.registerOnLoadHandler(fetchIssues);
    • 37. Requesting Data from Web Services <ul><li>AJAX + DOM </li></ul><ul><li>OAuth </li></ul><ul><li>Request Proxy </li></ul>
    • 38. gadgets.io.makeRequest() Requesting Data from Web Services
    • 39. What Can You Call? <ul><li>Any URL </li></ul><ul><li>XML and JSON are the most useful </li></ul>
    • 40. Fetching Issues function fetchIssues () { var url = &quot; http://jira.atlassian.com/sr/ &quot; + &quot;jira.issueviews:searchrequest-xml&quot; + &quot;/temp/SearchRequest.xml?&quot; + &quot;created%3Aprevious=-1w&resolution=-1&quot; + &quot;&sorter/field=issuekey&sorter/order=DESC&quot; + &quot;&sorter/field=created&sorter/order=DESC&quot; + &quot;&tempMax=20&quot; ; var params = {}; params[gadgets.io.RequestParameters.CONTENT_TYPE] = gadgets.io.ContentType.DOM; gadgets.io.makeRequest(url, handleResponse, params); }
    • 41. Handling the Response function handleResponse (obj) { var domData = obj. data ; var jiraIssues = { title : getTitle(domData), items : getItems(domData) }; renderJiraIssues(jiraIssues); msg.dismissMessage(loadMessage); gadgets. window .adjustHeight(); }
    • 42. Summary - Why write gadgets? <ul><li>Easy! </li></ul><ul><ul><li>Simple web based technologies mean anyone can write a gadget. </li></ul></ul><ul><li>Reusable! </li></ul><ul><ul><li>Use in any OpenSocial Container. iGoogle, Gmail, JIVE, more every day. </li></ul></ul><ul><li>Fun! </li></ul><ul><ul><li>Thinking about applications as atomic units of work add a new dimension to application design. </li></ul></ul>
    • 43. <ul><li>Building #opensocial gadgets is the easiest way to integrate external content into JIRA & Confluence. Join the #openapprevolution ! </li></ul>
    • 44. Questions? Mark Halvorson [email_address] Twitter: @ halv0112

    ×