html5-img
1 / 127

Jon Allen instructional media + magic, inc. As presented at the JA-SIG Winter Conference Bal Harbor, Florida, December

Introduction to XSLT. Jon Allen instructional media + magic, inc. As presented at the JA-SIG Winter Conference Bal Harbor, Florida, December 6, 2003. The Abstract….

brooke
Download Presentation

Jon Allen instructional media + magic, inc. As presented at the JA-SIG Winter Conference Bal Harbor, Florida, December

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Introduction to XSLT Jon Allen instructional media + magic, inc. As presented at the JA-SIG Winter Conference Bal Harbor, Florida, December 6, 2003

  2. The Abstract… Looking for a methodology to quickly and effectively create Transformations? Interested in the basics of XSLT and Xpath, and a good way to get started? If so, this workshop is for you! We will be discussing the fundamental concepts of XSLT and Xpath, and the methodologies that have emerged from months of developing stylesheet transformations for the uPortal 2.0 project. We will discuss the design aspects related to converting structured information in XML into device-dependent markup languages such as HTML, and WML, and the guidelines and best practices evolving from this experience. No prior XSLT experience is necessary.

  3. Overview • Introduction • uPortal • Basic XPath • Basic XSLT • Markup: XHTML • Cascading Style Sheets • Tools • The Creation Process • Hands-on

  4. Introduction

  5. Background • Who: W3C • What: XPath and XSLT Specs. • When: 11/16/1999 • Why: A need arose for a specification to define the syntax and semantics for transforming XML documents.

  6. References • “The” definitivereference… • Michael Kay • Wrox Press Inc • ISBN: 1861005067

  7. References • Great practicalreference… • Jeni Tennison • Hungry Minds • ISBN: 0764547763

  8. References • Practical use oftransformationsin Java code • Eric Burke • O'Reilly & Assoc. • ISBN: 0596001436

  9. JA-SIG’s uPortal

  10. Use of XSLT in uPortal • XSLT is used to render the "Structure", "Theme" and "Channels" • Structure is an XML to XML Transformation of Abstract Layout to Structured Layout (such as Tab and Column) • Theme is an XML to Markup Language Transformation (XHTML, WAP, etc) which renders the container for headers, navigation, channels, footers, etc. • Channels have XML to Markup Language Transformations that render content

  11. Structure XSLT Tab/Col/Row Tab/Column Tree/Column XSLT Processor User Layout XML XML StructureXSLT

  12. Conceptual Structure The Structure is XML at this point, the illustrations are representational

  13. Theme XSLT HTML 4.0Browser HTML 3.2PDA WML Mobile Phone XSLT Processor StructureXML ThemeXSLT

  14. Theme

  15. Channel XSLT Channel XML and Stylesheets Final Output Output Streamto Device

  16. Final Output

  17. Basic Architecture Channel XSLT Channel XSLT Framework Channel XSLT Structure XSLT Theme XSLT Skins - CSS

  18. Channel • Elementary unit of presentation, defined by the IChannel interface User InteractionExternal Information Channel Content(Presentation) IChannel

  19. IChannel content must • Be well-formed XML such as XHTML, RSS, SVG, SMIL, or a SOAP message (HTML is not well formed XML) • Rendered by an XSL transformation using an XSL stylesheet

  20. Framework Organization User Interaction Presentation uPortal Framework Channel Channel Channel

  21. User Layout • User Layout is an abstract structure defining the overall content available to the user • userLayout is a tree structure consisting of “folders” and “channels”, the later always being the leaf nodes

  22. User Layout

  23. User Layout Tab Tab Tab Column Channel Channel Channel Column Channel Channel Channel Channel Channel Structure Transformation

  24. Theme Transformation User Layout Tab Tab Tab Jim Smith Financial Aid Library Column Column Channel Channel Channel Channel Channel Channel Dictionary.com Bookmarks Cartoon

  25. Compiling the Presentation userLayout Structuretransformation XSLT structuredLayout setRuntimeData() XSLT Channels Themetransformation renderXML() HTML, WML VoiceML...

  26. Content Transformation XML XSLT Processor XHTML: Web Browser HTML: PDA Stylesheet WML: Cell Phone

  27. Multiple Target Devices

  28. Skins: Cascading Stylesheets

  29. Skin: im+m

  30. Skin: VSAC

  31. Skin: matrix

  32. User Preferences • Swappable layout and preference management modules • Profile management module • Tab-column specific prefs. module • Skin selection

  33. User Preferences

  34. Publish/Subscribe • Channel publishing document • Channel parameters • Default values • Modification permissions • Descriptions • Publish/Subscribe steps • Step sequence • Instructions, help • A complex channel with multiple XSL views

  35. uPortal Base Channel Types

  36. Applet Channel

  37. Image Channel

  38. Inline Frame

  39. Remote Channel

  40. RSS Channel

  41. Web Proxy Channel

  42. XSLT Channel

  43. Channel Controls

  44. Channel Review

  45. XHTML

  46. Why XHTML? • XSLT Stylesheets are XML documents • If you plan to output HTML, it will reside in the template bodies of the XSLT Stylesheet, and the markup will be output as literal output. • When the XSLT Stylesheet contains Markup, it has to be well formed

  47. Differences with HTML 4 • Due to the fact that XHTML is an XML application, certain practices that were perfectly legal in HTML 4 must be changed. • Documents must be well-formed • Well-formedness is a new concept introduced by [XML]. Essentially this means that all elements must either have closing tags or be written in a special form (as described below), and that all the elements must nest. • CORRECT: nested elements. <p>here is an emphasized <em>paragraph</em>.</p> • INCORRECT: overlapping elements <p>here is an emphasized <em>paragraph.</p></em>

  48. Differences with HTML 4 • Element and attribute names must be in lower case • XHTML documents must use lower case for all HTML element and attribute names. This difference is necessary because XML is case-sensitive e.g. <li> and <LI> are different tags.

  49. Differences with HTML 4 • In HTML 4 certain elements were permitted to omit the end tag; with the elements that followed implying closure. This omission is not permitted in XML-based XHTML. All elements must have an end tag. • CORRECT: terminated elements <p>here is a paragraph.</p><p>here is another paragraph.</p> • INCORRECT: unterminated elements <p>here is a paragraph.<p>here is another paragraph.

  50. Differences with HTML 4 • All attribute values must be quoted, even those which appear to be numeric. • CORRECT: quoted attribute values <table rows="3"> • INCORRECT: unquoted attribute values <table rows=3>

More Related