Lipstick on a Pig   Dynamically re-skinning a  legacy .NET portal with python Matt Hamilton [email_address]
Introduction <ul><li>Dynamically re-skinning a .NET portal site
Can't name the client
Portal for teachers in the UK
Aggregating content across legacy portal, Plone and Moodle </li></ul>
Who Am I <ul><li>Technical Director of Netsight </li><ul><li>Web development firm in UK </li></ul><li>10 years experience ...
More of an integrator than core developer </li><ul><li>I get involved in all those sticky projects of merging Plone in wit...
Where Were We?
Existing Portal (1.0) <ul><li>Five years old by November 2009
User registrations: 46,681
Course enrolments: 33,664
Resource Bank views: 247,911 </li></ul>
Existing Portal (1.0)
Problems with Current Portal <ul><li>Look-and-feel </li><ul><li>Not very compelling </li></ul><li>Usability </li><ul><li>C...
The Future - Portal 2.0 <ul><li>Usability, Design and Content Review April 2008
Strategic Review August 2008
Feasibility Studies Jan 2009
Pilot Demonstrator (“Portal V1.5”) March 2009 </li></ul>
Design Review
Architecture Review <ul><li>Portal 1.0 - Monolithic, tightly coupled, poor separation of skin </li></ul>
Architecture Review <ul><li>Portal 2.0 - Extensible, loosely coupled, good separation of skin </li></ul>
How Do We Get There? Remember: We Can't Touch the Existing System!
The Cunning Plan Skin 1.0 Portal 1.0 Existing Portal Module of functionality e.g. portfolio Browser
Total Skin Graft! Portal 1.5 New skin via xpath and xslt transformation. Web server needs to handle SSL. Together they giv...
Upcoming SlideShare
Loading in...5
×

Lipstick on a Pig - European Plone Symposium 2009

962

Published on

A talk I gave at the European Plone Symposium 2009 in Sorrento

So you have a big legacy portal application which you want to change the look of, but are contractually not allowed to touch? Here is a case study on how we used the power and flexibility of python and wsgi and the wonder of lxml to dynamically re-skin a proprietary .NET portal without even touching it. We take a giant lump of messy invalid HTML markup and dynamically strip it back, add semantic markup and CSS and present the user with a nice svelte valid site.

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

No Downloads
Views
Total Views
962
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
20
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Lipstick on a Pig - European Plone Symposium 2009

  1. 1. Lipstick on a Pig Dynamically re-skinning a legacy .NET portal with python Matt Hamilton [email_address]
  2. 2. Introduction <ul><li>Dynamically re-skinning a .NET portal site
  3. 3. Can't name the client
  4. 4. Portal for teachers in the UK
  5. 5. Aggregating content across legacy portal, Plone and Moodle </li></ul>
  6. 6. Who Am I <ul><li>Technical Director of Netsight </li><ul><li>Web development firm in UK </li></ul><li>10 years experience with Zope/Plone
  7. 7. More of an integrator than core developer </li><ul><li>I get involved in all those sticky projects of merging Plone in with other systems in an enterprise </li></ul></ul>
  8. 8. Where Were We?
  9. 9. Existing Portal (1.0) <ul><li>Five years old by November 2009
  10. 10. User registrations: 46,681
  11. 11. Course enrolments: 33,664
  12. 12. Resource Bank views: 247,911 </li></ul>
  13. 13. Existing Portal (1.0)
  14. 14. Problems with Current Portal <ul><li>Look-and-feel </li><ul><li>Not very compelling </li></ul><li>Usability </li><ul><li>Challenging in places </li></ul><li>A poor content management system </li><ul><li>Can't really edit general content, so use a separate FTP server and Dreamweaver </li></ul><li>Vendor lock-in </li><ul><li>Even small changes, very expensive </li></ul></ul>
  15. 15. The Future - Portal 2.0 <ul><li>Usability, Design and Content Review April 2008
  16. 16. Strategic Review August 2008
  17. 17. Feasibility Studies Jan 2009
  18. 18. Pilot Demonstrator (“Portal V1.5”) March 2009 </li></ul>
  19. 19. Design Review
  20. 20. Architecture Review <ul><li>Portal 1.0 - Monolithic, tightly coupled, poor separation of skin </li></ul>
  21. 21. Architecture Review <ul><li>Portal 2.0 - Extensible, loosely coupled, good separation of skin </li></ul>
  22. 22. How Do We Get There? Remember: We Can't Touch the Existing System!
  23. 23. The Cunning Plan Skin 1.0 Portal 1.0 Existing Portal Module of functionality e.g. portfolio Browser
  24. 24. Total Skin Graft! Portal 1.5 New skin via xpath and xslt transformation. Web server needs to handle SSL. Together they give us nice URLs. web server transformation proxy Skin 2.0 Browser Skin 1.0
  25. 25. Deliverance <ul><li>Several Different Projects </li><ul><li>xdv
  26. 26. Deliverance 0.3 </li></ul></ul>Nate just talked about Deliverence, so I won't go on about it
  27. 27. WSGI <ul><li>WSGI allows you to write small modules chained together in a 'pipeline'
  28. 28. Many small filters combined together as you need
  29. 29. Lots of existing components out there
  30. 30. Very easy to write new ones </li></ul>
  31. 31. WSGI Power - The Pipeline [pipeline:portal] pipeline = theme.portal ploneinterceptor xslt linkrewrite htmlcleaner source.portal [filter:theme.portal] use = egg:dv.xdvserver#xdv theme_uri = file://%(here)s/theme/theme.html rules = %(here)s/rules/content.xml [filter:ploneinterceptor] use = egg:ns.ploneinterceptor#ploneinterceptor [filter:xslt] use = egg:dv.xdvserver#xslt xslt_file = %(here)s/rules/transform.xsl [filter:linkrewrite] use = egg:ns.linkrewrite#linkrewrite [filter:htmlcleaner] use = egg:ns.htmlcleaner#htmlcleaner [app:source.portal] use = egg:Paste#proxy address = http://www.theexistingsite.org.uk/
  32. 32. Link Rewriting <ul><li>Old URL: </li><ul><li>http://www.theclient.org.uk/WebPortal.aspx?page=1&module=DB920A53-01EA-4886-8878-F2CDF5FA8CFD&mode=101&IsNonNewsDB920A53_01EA_4886_8878_F2CDF5FA8CFD=True&newsIdDB920A53_01EA_4886_8878_F2CDF5FA8CFD=11208#10
  33. 33. 205 characters! </li></ul><li>New URL: </li><ul><li>http://www.theclient.org.uk/news/11208#10
  34. 34. 41 characters! </li></ul></ul>
  35. 35. HTML Cleanup <ul><li>LXML rules! </li><ul><li>from lxml.html.clean import Cleaner cleaner = Cleaner(...) # Pretty print the HTML dom = document_fromstring(body) body = etree.tostring(dom, pretty_print=True) # Clean the HTML body = cleaner.clean_html(body) </li></ul></ul>
  36. 36. Result <ul><li>Old </li><ul><li>70kb of HTML
  37. 37. 120 Validation errors, 61 warnings </li></ul><li>New </li><ul><li>40Kb of HTML
  38. 38. 27 Errors, 1 warning (mainly xhtml/html conflicts)
  39. 39. No significant performance impact </li></ul></ul>
  40. 40. Putting all together
  41. 41. End Result New Style Portal content
  42. 42. Complications <ul><li>Navigation </li><ul><li>One page, two content sources, how is the navigation built? </li></ul><li>Search </li><ul><li>Search needs to go across multiple systems
  43. 43. Will soon be looking at Solr, Xapian, Google Mini </li></ul><li>.NET viewstate postback </li><ul><li>Massive hidden state variable, form wraps entire site! </li></ul></ul>
  44. 44. Questions? [email_address]
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×