• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Widget Platform
 

Widget Platform

on

  • 6,654 views

Widget Platform. Tear the Web apart and assemble the pieces together.

Widget Platform. Tear the Web apart and assemble the pieces together.

Brief survey on Widget Technology; widget platform and repository architecture; and UWA widget tutorial.

Statistics

Views

Total Views
6,654
Views on SlideShare
6,597
Embed Views
57

Actions

Likes
9
Downloads
189
Comments
0

6 Embeds 57

http://www.slideshare.net 38
http://codebits.eu 8
https://codebits.eu 7
http://www.linkedin.com 2
http://www.sohowire.com 1
http://www.conffs.com 1

Accessibility

Categories

Upload Details

Uploaded via as OpenOffice

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Widget Platform Widget Platform Presentation Transcript

    • Widget Platform tear the Web apart and assemble the pieces together José da Mata Fernandes [email_address] http://jose.wrkwrks.com www.twitter.com/josemf
    • Widget Platform
      • What is a Web widget
      • Widget Origins
      • SAPO Widgets Platform
      • Technical Details
      • UWA Widgets Development
    • Widget Platform
      • What is a Web widget
      • Widget Origins
      • SAPO Widgets Platform
      • Technical Details
      • UWA Widgets Development
    • What is a Web widget
      • Essentially, a Web widget is a local HTML/CSS/JavaScript Web application
        • Web Browser Environment
      • Small piece of your site
      Host Runtime Environment HTTP URI Unicode URI DOM XMLHTTPRequest JSON, XML, HTML CSS Resources
    • Examples
    • What is a Web widget
      • Desired properties
        • Simplicity, Reuse, User engagement, Remixability, Cross platform
      • Where these properties may come from?
    • Widget Platform
      • What is a Web widget
      • Widget Origins
      • SAPO Widgets Platform
      • Technical Details
      • UWA Widgets Development
    • Widget Origins
      • From websites, keyword search, directory portals, ...
      • From wikis, weblogs, social media aggregation, social networks, ...
      • From Enterprise 2.0, mashups, real-time Web, semantic search?
      • Widgets are Web 1.0, 2.0 and 3.0. But are only really interesting since 2.0.
      2004 1995 5.5 2000 2002 2008 email ftp usenet IRC BBS Gopher World Wide Web 1990 HTTP HTML SOAP Java XML Javascript P2P Flash RDF OpenID RSS AJAX ATOM OWL SPARQL Web 2.0 Semantic Web Microformats JS Frameworks
    • Widget Origins
      • What have:
        • HTML/JS Snippets, Portlets, Web parts, Flash Widgets, Mashups
      • To do with:
        • Web Widgets?
    • First Widget ever... … the hit counter!
    • Others alike... Snippets
      • Copy past HTML+Javascript snippet to website
      • Can have visitor state (cookies)
      • May have been impressive...
      • Simplicity
    • Portlets
      • Pluggable, reusable component
      • Fragment of markup code for portal composition
      • Used in the late 90s:
        • Altavista, AOL, Excite and Yahoo!
      • Now prepackaged in Enterprise Portal software:
        • Liferay, JBoss Enterprise, DotNetNuke, Joomla!, IBM Websphere…
      • Portlet Specifications...
        • Java portlet specification (JSR)
      • … for portlet engines
        • Personalization, presentation and security
    • Web part (WSS sharepoint)
      • Windows Sharepoint services
      • Server side based
      • Output HTML
      • XML config and metadata
      • Maybe too much for a <p>Hello World</p>?
    • Portlets example (JSR)
      • Java portlet specification JSR286
      • Server side based
      • Output HTML
      • XML config and metadata
      • Open specification based
        • Reuse
    • Media is Everything... Flash Widgets
      • Flash (other media) object HTML reference
      • Multi-media based (why always the dark themes?)
      • Cross-browser (assuming user has the plugin...)
      • Advertising
      • User engagement
    • Mashup Remix the Web
      • Combination – combine application data with external data
      • Aggregation – create information with the data
      • Visualization – explain complex information
    • Mashup technology
      • Data format
        • JSON, XML, YAML, CSV,
      • Data API
        • REST, SOAP, XML-RPC,
      • Server side, desktop, browser
        • XmlHttpRequest, sockets, cURL,
      • Presentation
        • Flash, DOM, HTML5 Canvas,
      • Remixability
      Data sources Information Mashup
    • Mobile Widgets
      • Web Standards: W3C Widgets 1.0 based
      • Widget is downloaded and stored:
        • Available for offline use
      • Proprietary device APIs (camera, geolocation, SMS, etc)
      • Desktop browsers are becoming boring:
        • Android Webkit, Opera Mobile, Opera Mini, Netfront, Safari, Blackberry, S60 Webkit, IE Mobile, Iris, Bolt, Skyfire, and more...
      • Cross Platform (some day hopefully...)
    • Web widgets origins
      • Snippets
      • Portlets
      • Flash Widgets (Silverlight, Adobe Air, etc)
      • Mashup
      • Mobile Widget
    • Widget Platform
      • What is a Web widget
      • Widget Origins
      • SAPO Widgets Platform
      • Technical Details
      • UWA Widgets Development
    •  
    • Project Insight
      • Started at consulting as a customized startup page for
      • Adopted by for the widget repository and environment for
      • Included developers tools
      • Extended for multi-platform (cross-domain) widget services
      • Extended for multi-format widget services
    • Customized startup page
        Apache Server
        Widgets page
      • Widgets as xhtml documents
      • PHP, Mysql, Javascript
      • JQuery for “widget framework”
      • Fetched server side and embedded on “the slot”
      • IFrame
      • Some support for widget settings
    • Widget storage and UWA
        UWA
        Widget Platform
      • Exposition Server (Netvibes)
      • UWA Widgets (Netvibes)
      • Widget database storage
      • Development tools
    • Multi-platform API
        UWA
        Widget Platform
      • API for widgets services
        • Based on Apache Wookie
      • PHP libraries for server-side integration
      • Template for widgets pages
        • For widget runtime environment
        • For widget instantiation
    • Multi-platform API
        UWA
        Widget Platform
      • Cross-domain AJAX
      • Service profile concept
        • Widget environment
        • Widget catalog
      • Security
        • Widget boxing in widget pages
        • HTTP Basic/Digest with SSL
    • Multi-format support
        Widgets SAPO
      • Widget import feature for several widget formats
      • On-demand conversion for other formats
      • Open developer tools for developers
      • Open catalog for users
    • Widget Platform
      • What is a Web widget
      • Widget Origins
      • SAPO Widgets Platform
      • Technical Details
      • UWA Widgets Development
    • Customized startup page
    • Customized startup page
      • Page layout server side, with widget skeleton
        • Environment (Browser) call widget.onLoad for each widget
      • Widgets run inline in the page (vs Iframe method)
      • Widget approval mechanism
        • Best case scenario should be widget “boxing” or capability model.
          • Ex: Google Caja, Ad Safe
      • UWA Widgets
        • Javascript framework for DOM, AJAX and widget properties
    • Customized startup page
      • AJAX
        • Cross domain requests
        • On demand javascript, <script> tag
        • Json-p for Json requests
    • Widget Catalog
    • Widget Catalog
      • UWA Widget Importation
    • Widget Catalog
      • UWA Widget Exportation
        • Platforms UWA, Opera, Nokia WRT, Samsung W3C, Igoogle, Applet dashboard, Windows Vista, Windows Live, Yahoo widgets, etc
      • Fetch widget parts -> Instantiate target compiler -> set parameters -> call render()
        • Fetch referenced images and other dependencies, if it must
    • Widget Syndication API
      • Apache Wookie
      • W3C Widgets 1.0
      • REST API
    • Widget Syndication API
      • Widget REST Services
        • Widget API
          • Fetch widget parts from ids
          • Fetch “catalog” widgets
          • Update/Store widgets
        • Category API
          • Fetch categories
          • Fetch associated widgets
          • Create/change categories
          • Associate widgets to categories
        • Environment API
          • Fetch widget runtime environment for portals implementing widget page technology
    • Widget Platform
      • What is a Web widget
      • Widget Origins
      • SAPO Widgets Platform
      • Technical Details
      • UWA Widgets Development
    • UWA Widgets Development
    • UWA Widgets Development
      • A UWA Codebits Widget
      • Into the Universal Widget API
      • SAPO Widgets for developers
    • UWA file format Title Metadata Widget preferences Widget Stylesheet Widget Code Widget Body
    • UWA document
      • XHTML strict Based
        • XML extension for widget preferences
        • Netvibes namespace
      • UTF-8
      • No server side code
    • Widget Metadata
      • Gives information about:
        • The widget
        • Developers
        • Environment
    • SAPO Widget Metadata
    • Widget Preferences
      • Widget (Application) settings and state persistence
      • Data types: Text, Boolean, Hidden, Password, List, Range
    • SAPO Widget Preferences
    • Widget Body
      • XHTML
      • Just the <body> part (without the tag)
      • No JavaScript, No Styles
        • Although you can use the style attribute
    • SAPO Widget Body
    • Widget Style
      • CSS inside the <head><style> tag
      • You should “namespace“ your styles
    • SAPO Widget Style
    • Widget Code
      • JavaScript
      • UWA Data API
        • AJAX
        • UWA Feed Format
      • Widget API
        • Events
        • Preferences
        • DOM
      • DOM Extensions
    • SAPO Widget Code
    • UWA API Host Runtime Environment HTTP URI Resources Unicode URI DOM XMLHTTPRequest JSON, XML, HTML CSS UWA.Data API Widget API UWA Events UWA Extensions UWA Prefs
    • UWA.Data API
      • UWA.Data.getText(url, callback)
      • UWA.Data.getXml(url, callback)
      • UWA.Data.getJson(url, callback)
      • UWA.Data.getFeed(url, callback)
      • UWA.Data.request
      method: GET, POST proxy: ajax, feed type: text, xml, json, html cache: in seconds onComplete: callback parameters: url encoded onFailure: callback
    • UWA.Data Feed API RSS, RSS2, Atom UWA JSON Feed Format Items* enclosures*
    • Widget Events API
      • widget.onRefresh
      • widget.onResize
      • widget.onKeyboardAction
      • widget.onSearch
    • Widget Preferences API
      • Getters:
        • getValue, getInt, getBool
      • Setters:
        • setValue
    • UWA Extensions
      • Widget API for DOM
        • widget.body
        • widget.setBody
        • widget.createElement
      • DOM Element
        • appendText, empty, setHtml, setStyle,getDimensions, show, ...
      • Array
        • Based on JavaScript 1.6
        • forEach, some, map, ...
      • String
        • IsEmail, stripTags, ...
    • Fim Any Questions?