Skip to Content

Changes for page ERDivaLook

Last modified by Ravi Mendis on 2010/09/10 01:14
From version 261.1
edited by Ravi Mendis
on 2010/08/05 03:21
Change comment: There is no comment for this version
To version 260.1
edited by Ravi Mendis
on 2009/07/16 08:36
Change comment: Add note on ajax page configs

Summary

Details

Page properties
Content
... ... @@ -3,8 +3,8 @@
3 3  Much like ExcelLook, that vends excel pages, Diva look generates a Web 2.0 interface for DirectToWeb.
4 4  More specifically, it generates pages that are:
5 5  
6 -* **Tablesless** or use [[Semantic markup>>http://en.wikipedia.org/wiki/Semantic_HTML]]
7 -* (x)HTML5 compliant
6 +* Semantically-rich or **tables-less**
7 +* XHTML 1.0 strict compliant
8 8  * Sans images, inline styles or presentation attributes
9 9  
10 10  They make use of:
... ... @@ -12,9 +12,9 @@
12 12  * CSS **themes**
13 13  * Scriptaculous **effects**
14 14  * Javascript **widgets**
15 -* **Ajax**
15 +* Ajax
16 16  
17 -== Why Table-less Markup? ==
17 += Why Table-less Markup? =
18 18  
19 19  Scriptaculous, jQuery effects, etc work by manipulating CSS attributes.
20 20  Mostly they don't work very well on tables, if at all.
... ... @@ -33,18 +33,19 @@
33 33  
34 34  All your customizations to the look and layout of your application is also done in the CSS (and via D2W rules).
35 35  
36 -**Examples:**
36 +===== Example Diva Themes: =====
37 37  
38 -|= Neutral |= WebObjects |= Simple |= Organica Creativa
39 -| [[image:Picture 1.jpg||]] | [[image:Picture 2.jpg||]] | [[image:Picture 3.jpg||]] | [[image:slides_directtoweb_04.jpg.jpeg||]]
40 -| D2W Neutral look reverse engineered
41 -\\as a Diva Theme | D2W WebObjects look reverse engineered
42 -\\as a Diva Theme | [[//Simple//>>http://www.csszengarden.com/?cssfile=/174/174.css&page=2]] theme from css Zen Garden | [[//Organica Creativa//>>http://www.csszengarden.com/?cssfile=/188/188.css&page=0]] theme from css Zen Garden
43 -| //Included in ERDivaLookExample// | //Included in ERDivaLookExample// | Shawn Chin [[mailto:schin@shawnchin.net]] | Eduardo Cesario [[mailto:design@criaturacreativa.com.ar]]
38 +The following are a sample of themes for Diva look. The first two are included in the Wonder/Examples/Ajax/ERDivaLookExample app.
44 44  
45 -The above are a sample of themes for Diva look. The first two are included in the ##Wonder/Examples/Ajax/ERDivaLookExample## app.
46 -The graphics designer Eduardo Cesario wrote up his experience of developing his //Organica Creativa// design for an early prototype of ERDivaLook on his [[blog>>http://www.organicacreativa.com/directtoweb-mutation/]].
40 +|= Neutral |= WebObjects |= Simple |= Organica
41 +| [[image:Picture 1.jpg||]] | [[image:Picture 2.jpg||]] | [[image:Picture 3.jpg||]] | [[image:slides_directtoweb_04.jpg.jpeg||]]
42 +| D2W Neutral look reverse engineered
43 +as a Diva Theme | D2W WebObjects look reverse engineered
44 +as a Diva Theme | [[//Simple//>>http://www.csszengarden.com/?cssfile=/174/174.css&page=2]] theme from css Zen Garden | [[//Organica//>>http://www.csszengarden.com/?cssfile=/188/188.css&page=0]] theme from css Zen Garden
45 +| //Included in ERDivaLookExample// | //Included in ERDivaLookExample// | Shawn Chin [[mailto:schin@shawnchin.net]] | Eduardo Cesario [[mailto:design@criaturacreativa.com.ar]]
47 47  
47 +The graphics designer Eduardo Cesario wrote up his experience of developing his //Organica// design for an early prototype of ERDivaLook on his [[blog>>http://www.organicacreativa.com/organica-creativa.php?area=directtoweb&lang=en]].
48 +
48 48  == HowTos ==
49 49  
50 50  {{children all="true"}}{{/children}}
... ... @@ -68,16 +68,15 @@
68 68  
69 69  === 4. Well-Formed Semantic Markup ===
70 70  
71 -The pages produced by Diva look will pretty much validate as (x)HTML5. Features of the DOM:
72 +The pages produced by Diva look will validate as 98% XHTML strict. Features of the DOM:
72 72  
73 73  * Unique IDs for elements
74 74  * Unique form control names
75 75  * Use of multiple CSS classes
76 -* Table-less markup (except for tabular data)
77 77  
78 78  === 5. Ajax Page Configurations ===
79 79  
80 -Prototype provides the Ajax functionality in Diva in the form of [[ERPrototaculous>>ERPrototaculous]].
80 +Prototype provides the Ajax functionality in Diva in the form of [[ERPrototype>>ERPrototaculous]].
81 81  Diva look introduces the concept of **Ajax pageConfigs**.
82 82  Example page configurations:
83 83  
... ... @@ -85,6 +85,4 @@
85 85  * ##AjaxEditStudio##
86 86  * ##AjaxListTalent##
87 87  
88 -=== 6. Dynamic D2W ===
89 -
90 -Ajax + //delayed// D2W rules = [[dynamic D2W>>How to use Dynamic D2W]].
88 +Support for turning on property-level Ajax updates is included (for to-one and to-many relationships on edit pages).