Wiki source code of ERModernLook

Last modified by Kieran Kelleher on 2010/10/04 23:03

Hide last authors
David Holt 21.1 1 = ERModernLook =
2
3 === Overview ===
4
David Holt 61.1 5 [[Go to David LeBer's original blog post introducing ERModernLook to the world.>>url:http://davidleber.net/?p=402||shape="rect"]]
David Holt 39.1 6
David Holt 61.1 7 [[David's introductory presentation to WONoVA (screencast)>>url:http://www.wocommunity.org/podcasts/ERModernDirectToWebIntro.mov||shape="rect"]]
David Holt 21.1 8
David Holt 61.1 9 === Working with the ERModernLook in your new projects ===
David Holt 21.1 10
David Holt 61.1 11 ERModernLook is now the default Look framework used in DirectToWeb projects. You simply create a New -> Wonder D2W Application in your workspace and you're already using it!
David Holt 21.1 12
David Holt 61.1 13 === [[image:attach:EclipseScreenSnapz002.png]] ===
David Holt 21.1 14
David Holt 61.1 15 === Features of the ERModernLook ===
David Holt 47.1 16
Kieran Kelleher 74.1 17 ~1. [[ClickToOpen>>doc:documentation.Home.WOLips Tutorials.Click to Open.WebHome]] support is now included by default with ERModernLook. Just set your wolips password and you're good to go! (by default the properties file has it set to "my_password"). You should see the expanded WOLToolbar below the D2WDebugFlags.
David Holt 47.1 18
David Holt 61.1 19 === [[image:attach:ERD2WDebugFlags - Click to Open.jpg]] ===
David Holt 47.1 20
David Holt 61.1 21 2. Simple styling for the conditional error message on the login page has been added to the project template which results in the following error block:
David Holt 47.1 22
David Holt 61.1 23 [[image:attach:Error styling on login page.png]]
David Holt 47.1 24
David Holt 61.1 25 3. There is a built-in D2W component that will automatically handle ERAttachments. To use it, name the property key that you have used for your ERAttachment and then specify componentName = "ERMD2WEditAttachment". That's it!
David Holt 49.1 26
David Holt 61.1 27 [[image:attach:RuleModeler.png]]
David Holt 49.1 28
David Holt 61.1 29 This results in the following component in your "Create" page.
David Holt 55.1 30
David Holt 61.1 31 [[image:attach:Safari.png]]
David Holt 55.1 32
David Holt 61.1 33 4. To add your own CSS styling that won't be overwritten by any changes to the default stylesheets, follow these steps:
David Holt 55.1 34
David Holt 61.1 35 (% style="color: rgb(0,0,0);" %)1. Add a style sheet to the app's WebServerResources.
David Holt 55.1 36
David Holt 61.1 37 (% style="color: rgb(0,0,0);" %)2. Add a rule to your app's rules
David Holt 59.1 38
39
40
David Holt 61.1 41 {{unmigrated-wiki-markup}}
42 20 : \*true\* => appScreenStylesheet = {"filename" = "app_screen_stylesheet.css"; "framework" = "app"; "media" = "screen"; } \[WO:com.webobjects.directtoweb.Assignment\]
43 {{/unmigrated-wiki-markup}}
David Holt 59.1 44
David Holt 61.1 45 (% style="color: rgb(0,0,0);" %)3. Copy the stylesheets rule from ERModernLook and add it to your app's rules with a higher priority and a reference to your stylesheet:
46
47 (% style="color: rgb(0,0,0);" %)30 : *true* => stylesheets = ("defaultMainScreenStylesheet", "defaultMainPrintStylesheet", "datepickerStylesheet", "appScreenStylesheet") [WO:com.webobjects.directtoweb.Assignment]