Skip to content

Commit efe6510

Browse files
author
Olivier Giulieri
committed
Added content.
1 parent d8a4a4c commit efe6510

File tree

7 files changed

+108
-81
lines changed

7 files changed

+108
-81
lines changed

‎dist/css/demo.css‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,6 +99,11 @@ body {
9999
.evo-icon-16 {
100100
margin-right: 6px !important;
101101
}
102+
/* index.html */
103+
.title2 {
104+
font-size: smaller;
105+
font-weight: normal;
106+
}
102107
/* winecellar demo */
103108
.winecellar .evol-many-cards > div.panel {
104109
height: 240px !important;

‎doc/actions.html‎ renamed to ‎doc/controller.html‎

Lines changed: 7 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<!DOCTYPE html>
22
<html>
33
<head>
4-
<title>Views</title>
4+
<title>Controller</title>
55
<link href="../dist/css/demo.css" rel="stylesheet" />
66
<link href="../dist/css/evolutility.css" rel="stylesheet" />
77
<link id="bwCSS" href="../dist/css/bootstrap.min.css" rel="stylesheet" />
@@ -19,28 +19,19 @@
1919
<div class="doc-links">
2020
<a href="ui-model.html">ui-model</a> -
2121
<a href="views.html">views</a> -
22-
<a href="actions.html" class="sel">actions</a>
22+
<a href="controller.html" class="sel">controller</a>
2323
</div>
2424
<div class="clearfix"></div>
2525
</div>
2626

27-
<h1><strong>Views for Action</strong></h1>
27+
<h1>Evol.ViewToolbar</h1>
2828

2929

30-
<h2>toolbar</h2>
31-
<p>Also acts as controller</p>
30+
<p>The controller is not the usual MVC controller.
31+
Right now Evolutility controller controls all views and also act as a toolbar.</p>
3232

33-
<h2>filter</h2>
34-
<p> </p>
35-
36-
<h2>export</h2>
37-
<p> </p>
38-
39-
<h2>group</h2>
40-
<p> </p>
41-
42-
<h2>massupdate</h2>
43-
<p> </p>
33+
<code>
34+
new Evol.ViewToolbar(myConfig);</code>
4435

4536
<p><br/>evolutility.js at <a href="https://github.com/evoluteur/evolutility" target="download">GitHub</a></p>
4637

‎doc/index.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
<div class="doc-links">
1919
<a href="ui-model.html">ui-model</a> -
2020
<a href="views.html">views</a> -
21-
<a href="actions.html">actions</a>
21+
<a href="controller.html">controller</a>
2222
</div>
2323
<div class="clearfix"></div>
2424
</div>
@@ -30,11 +30,11 @@ <h1>documentation :: evolutility.js</h1>
3030

3131
<ul class="">
3232
<li><a href="ui-model.html">ui-model</a>
33-
<br/>A declarative language to describe application UI models.</li>
33+
<br/>A declarative language to define the UI of Backbone models.</li>
3434
<li><a href="views.html">views</a>
3535
<br/>A set of Backbone.js views for one model or a collection of models.</li>
36-
<li><a href="actions.html">actions</a>
37-
<br/>A set of Backbone.js views for actions.</li>
36+
<li><a href="controller.html">controller</a>
37+
<br/>A controller and a toolbar to interact with the views.</li>
3838
</ul>
3939

4040
<p></p>

‎doc/ui-model.html‎

Lines changed: 19 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
<div class="doc-links">
1919
<a href="ui-model.html" class="sel">ui-model</a> -
2020
<a href="views.html">views</a> -
21-
<a href="actions.html">actions</a>
21+
<a href="controller.html">controller</a>
2222
</div>
2323
<div class="clearfix"></div>
2424
</div>
@@ -35,47 +35,36 @@ <h1>ui-model</h1>
3535

3636
<p>Let's make a model for the UI the same way Backbone provides a model for the data.</p>
3737

38-
<p>An object containing tabs containing panels containing fields. This ui-model defines all <a href="views.html">views</a>.</p>
39-
4038
<p>This is not fully defined nor implemented yet but a work in progress based on <a href="http://www.codeproject.com/Articles/28636/Minimalist-Meta-Model-for-CRUD-Applications" target="evomm">Evolutility minimalist meta-model</a>.</p>
4139

4240

4341
<section id="object">
4442
<h2>object</h2>
4543

46-
<p><code>form</code> is the root element. It doesn't represent one
47-
single web form, but all necessary web forms (Edit, View, List, Search,
48-
Advanced Search, Export) at once.
49-
It has the optional attributes <code>label</code>, <code>description</code> and <code>version</code>, and the required namespace <code>xmlns</code>.
50-
</p>
51-
52-
<p>The <code>form</code> element contains one element <code>
53-
data</code> and one or more elements <code>panel</code>. Fields are displayed or not on each web form based on
54-
the attributes <code>search</code>, <code>
55-
searchlist</code>, and <code>searchadv</code>.</p>
44+
<p>An "object" is the UI information added to the Backbone model.
45+
This ui-model defines all <a href="views.html">views</a>.</p>
5646

57-
<p>
5847

5948

6049
<table class="table table-bordered">
6150
<tbody><tr>
62-
<td style="width: 120px; ">entity
51+
<td style="width: 120px; ">entity<span class="evol-required">*</span>
6352
</td>
6453
<td>User's object name for the database object (for example: &quot;task&quot; for a
6554
to do list application).
6655
</td>
6756
</tr>
6857
<tr>
69-
<td>entities
58+
<td>entities<span class="evol-required">*</span>
7059
</td>
7160
<td>Plural for <code>entity</code> (example &quot;tasks&quot; for the to do list).
7261
</td>
7362
</tr>
7463
<tr>
75-
<td>elements[]
64+
<td>elements[]<span class="evol-required">*</span>
7665
</td>
7766
<td>
78-
Array of tabs or panels.
67+
Array of tabs or panels which contains fields.
7968
</td>
8069
</tr>
8170
<tr>
@@ -98,14 +87,13 @@ <h2>object</h2>
9887
Example: <code>$title</code>=&quot;#title&quot; </td>
9988
</tr>
10089
</tbody></table>
90+
91+
<span class="evol-required">*</span>: required attribute.
10192
</section>
10293

10394
<section id="field">
10495
<h2>field</h2>
105-
<p>The elements <code>field</code> represents fields on the screen, and database columns at once. It is
106-
the most used element and the element with the most attributes. Database
107-
columns hidden to the user (like the primary key of the driving table) are not
108-
declared.</p>
96+
<p>Attributes in your Backbone model are mapped to fields in the UI.</p>
10997

11098
<table class="table table-bordered">
11199
<tbody>
@@ -115,20 +103,21 @@ <h2>field</h2>
115103
</tr>
116104
<tr>
117105
<td>attribute </td>
118-
<td>Model attribute mapping to the field.</td>
106+
<td>Model attribute mapping to the field.
107+
If no value is provided for "attribute", the value of the attribute "id" is used.</td>
119108
</tr>
120109
<tr>
121-
<td>id </td>
110+
<td>id<span class="evol-required">*</span></td>
122111
<td>Field Id in the UI.</td>
123112
</tr>
124113
<tr>
125-
<td>label, labelone,<br /> labelmany
114+
<td>label<span class="evol-required">*</span>, labelone,<br /> labelmany
126115
</td>
127116
<td>Field title (in different views). Only <code>label</code> is mandatory and will be the default for all other modes if not specified.
128117
</td>
129118
</tr>
130119
<tr>
131-
<td>type
120+
<td>type<span class="evol-required">*</span>
132121
</td>
133122
<td>
134123
The type of the field in the UI.
@@ -143,6 +132,7 @@ <h2>field</h2>
143132
<li><span data-id="#html"><img alt="" class="Icon" src="pix/dico/ft-htm.gif">html (RTF)</span></li>
144133
<li><span data-id="#image"><img src="pix/dico/ft-img.gif" alt="" class="Icon">image</span></li>
145134
<li><span data-id="#lov"><img src="pix/dico/ft-lov.gif" alt="" class="Icon">lov (list of values)</span></li>
135+
<li><span data-id="#textmoney"><img src="pix/dico/ft-money.gif" alt="" class="Icon">money</span></li>
146136
<li><span data-id="#text"><img src="pix/dico/ft-txt.gif" alt="" class="Icon">text</span></li>
147137
<li><span data-id="#textmultiline"><img src="pix/dico/ft-txtml.gif" alt="" class="Icon">textmultiline</span></li>
148138
</ul>
@@ -195,6 +185,7 @@ <h2>field</h2>
195185
<td>width
196186
</td>
197187
<td><p>Width of the field in percentage of the Panel it belongs to.
188+
<br/>Default: 100%
198189
</p></td>
199190
</tr>
200191

@@ -313,6 +304,8 @@ <h2>field</h2>
313304

314305
<section id="sections">
315306
<h2>sections</h2>
307+
<p>Fields are grouped in panels and panels can be grouped in tabs. </p>
308+
316309

317310
<h3>panel</h3>
318311
<p>The <code>panel</code> element is used to visually group fields together on the screen.</p>

‎doc/views.html‎

Lines changed: 62 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -18,25 +18,44 @@
1818
<div class="doc-links">
1919
<a href="ui-model.html">ui-model</a> -
2020
<a href="views.html" class="sel">views</a> -
21-
<a href="actions.html">actions</a>
21+
<a href="controller.html">controller</a>
2222
</div>
2323
<div class="clearfix"></div>
2424
</div>
2525

26-
<h1><strong>Views</strong></h1>
26+
<h1>Views</h1>
2727

28+
<p>All views for a particular model are defined by a single <a href="ui-model.html">ui-model</a>.</p>
2829
<p>
2930
2 sets of views:
3031
<ul>
31-
<li>for <strong>one</strong> model</li>
32-
<li>for a collection of <strong>many</strong> models</li>
32+
<li>Evol.ViewOne - Views for <strong>one</strong> model</li>
33+
<li>Evol.ViewMany - Views for for a collection of <strong>many</strong> models</li>
3334
</ul>
3435
</p>
3536

36-
<h2><strong>Views for Many</strong></h2>
37+
<h2>Evol.ViewOne</h2>
3738

38-
<p>Backbone views to see a collection w/ many records.</p>
39-
<p>All views are defined by the same <a href="ui-model.html">ui-model</a> defines</p>
39+
<p>Backbone views to edit one model (a record at a time)</p>
40+
<h3>Edit</h3>
41+
<p>All fields</p>
42+
<code>
43+
new Evol.ViewOne.Edit(myConfig);</code>
44+
45+
<h3>Mini</h3>
46+
<p>Only important fields</p>
47+
<code>
48+
new Evol.ViewOne.Mini(myConfig);</code>
49+
50+
<h3>JSON</h3>
51+
<p>JSON representation of the data.</p>
52+
<code>
53+
new Evol.ViewOne.JSON(myConfig);</code>
54+
55+
56+
<h2>Evol.ViewMany</h2>
57+
58+
<p>Backbone views for a collection w/ many records.</p>
4059

4160

4261
<h3>list</h3>
@@ -56,43 +75,55 @@ <h3>charts</h3>
5675
new Evol.ViewMany.Charts(myConfig);</code>
5776

5877

78+
<h2>Methods</h2>
5979

60-
<h2><strong>Views for One</strong></h2>
80+
<h3>Evol.ViewOne and Evol.ViewMany</h3>
6181

62-
<p>Backbone views to edit one model (a record at a time)</p>
63-
<h3>edit</h3>
64-
<p>All fields</p>
65-
<code>
66-
new Evol.ViewOne.Edit(myConfig);</code>
82+
<p>cardinality: '1' for Evol.ViewOne.*, 'n' for Evol.ViewMany.*.</p>
83+
<p>render()</p>
84+
<p>getFields(): returns the list of fields present in the view.</p>
85+
<p>setModel(model)</p>
86+
<p>getModel()</p>
87+
<p>setUIModel(uiModel)</p>
88+
<p>getUIModel()</p>
89+
<p>getTitle()</p>
6790

68-
<h3>mini</h3>
69-
<p>Only important fields</p>
70-
<code>
71-
new Evol.ViewOne.Mini(myConfig);</code>
91+
<h3>Evol.ViewOne</h3>
92+
<p>clear()</p>
93+
<p>getData()</p>
94+
<p>setData(data)</p>
95+
<p>getFields()</p>
96+
<p>setFieldValue(fid, value)</p>
97+
<p>getFieldValue(fid)</p>
98+
validate
99+
clearErrors
72100

73-
<h3>json</h3>
74-
<p>JSON representation of the data.</p>
75-
<code>
76-
new Evol.ViewOne.JSON(myConfig);</code>
101+
<h3>Evol.ViewMany</h3>
102+
<p>setCollection(collec)</p>
103+
<p>getCollection()</p>
104+
<p>setFilter(filter)</p>
105+
<p>getFilter()</p>
77106

78-
<h2>Methods</h2>
79107

80-
<h3>All views</h3>
81108

82-
getFields(): returns the list of fields used by the view.
109+
<h2>Properties</h2>
83110

111+
<h3>Evol.ViewOne and Evol.ViewMany</h3>
84112

85-
<h3>One</h3>
113+
<p>cardinality: '1' for Evol.ViewOne.*, 'n' for Evol.ViewMany.*.</p>
114+
<p>viewName: name of the view (the '*' in the Evol.ViewOne.* instanciated).</p>
86115

87-
<p>getData()</p>
88-
<p>setData(data)</p>
89-
<p>getFields()</p>
90-
<p>clear()</p>
91-
setFieldValue: function (fid, value)
92116

93-
<h3>Many</h3>
94117

118+
<h2>Events</h2>
119+
120+
<h3>Evol.ViewOne</h3>
121+
122+
<p>action: w/ data = 'add', 'add-new', 'cancel'</p>
123+
124+
<h3>ViewMany</h3>
95125

126+
<p>validate</p>
96127

97128
<p><br/>evolutility.js at <a href="https://github.com/evoluteur/evolutility" target="download">GitHub</a></p>
98129

‎index.html‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,13 +18,14 @@
1818
<div class="clearfix"></div>
1919
</div>
2020

21-
<h1 id="title">evolutility.js</h1>
21+
<h1 class="title1">evolutility.js<span class="title2">: UI models for your Backbone models.</span></h1>
22+
2223

23-
<p></p>
2424

25-
<p>evolutility is a work in progress. Eventually it will be a generic UI to build applications who can change form, volume, and structure like living organisms.
25+
<div class="clearer"></div>
2626

27-
<p class="dft"><strong>Evolutility</strong> <em>(Bio.)</em>: The faculty possessed by all substances capable of self-nourishment of manifesting the nutritive acts by change of form, of volume, or of structure.
27+
<p>Most Backbone models will need the same kind of Backbone views.
28+
These views can be dynamically rendered with evolutility.js.
2829

2930
<p>The idea is to build a set of generic Backbone views to perform all CRUD (Create, Read, Update and Delete) on records of any data structure. These generic Backbone views will all be defined in a single UI-model containing the description of UI (layout, fields and behaviors).
3031

‎less/demo.less‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,12 @@ body{
107107
margin-right: 6px !important;
108108
}
109109

110+
/* index.html */
111+
.title2{
112+
font-size:smaller;
113+
font-weight: normal;
114+
}
115+
110116
/* winecellar demo */
111117
.winecellar .evol-many-cards {
112118

0 commit comments

Comments
 (0)