Changes for page Your First D2W Project

Summary

• Page properties (1 modified, 0 added, 0 removed)

Details

Page properties

Content

...	...	@@ -138,4 +138,87 @@
138	138
139	139	{{/code}}
140	140
141		-The first array defines what the top level navigation is going to be, and this is where we define the two tabs (the childrenChoice dictionary). After that, we define the other parts of the navigation. You see references to //action = session.navController//. This is the action (method) that will be called for the specified navigation element, so let's create those methods in the **MainNavigationController** class.
	141	+The first array defines what the top level navigation is going to be, and this is where we define the two tabs (the //childrenChoice// dictionary). After that, we define the other parts of the navigation. You see references to //action = session.navController//. This is the action (method) that will be called for the specified navigation element, so let's create those methods in the **MainNavigationController** class.
	142	+
	143	+The first method we will implement in **MainNavigationController** is a generic method to list objects for a specific entity.
	144	+
	145	+{{code language="java"}}
	146	+
	147	+public WOComponent listPageForEntityName(String entityName) {
	148	+ ListPageInterface listPage = D2W.factory().listPageForEntityNamed(entityName, session());
	149	+ EODataSource dataSource = new EODatabaseDataSource(session().defaultEditingContext(), entityName);
	150	+ listPage.setDataSource(dataSource);
	151	+ return (WOComponent) listPage;
	152	+ }
	153	+
	154	+{{/code}}
	155	+
	156	+The controller already have methods to query objects (//queryPageForEntityName//) and create new ones (//newObjectForEntityName//), so the next step is to create the methods for our two entities.
	157	+
	158	+{{code language="java"}}
	159	+
	160	+public WOComponent listPostsAction() {
	161	+ return listPageForEntityName(BlogEntry.ENTITY_NAME);
	162	+ }
	163	+
	164	+ public WOComponent listAuthorsAction() {
	165	+ return listPageForEntityName(Author.ENTITY_NAME);
	166	+ }
	167	+
	168	+ public WOComponent createPostAction() {
	169	+ return newObjectForEntityName(BlogEntry.ENTITY_NAME);
	170	+ }
	171	+
	172	+ public WOComponent createAuthorAction() {
	173	+ return newObjectForEntityName(Author.ENTITY_NAME);
	174	+ }
	175	+
	176	+ public WOComponent searchAuthorsAction() {
	177	+ return queryPageForEntityName(Author.ENTITY_NAME);
	178	+ }
	179	+
	180	+ public WOComponent searchPostsAction() {
	181	+ return queryPageForEntityName(BlogEntry.ENTITY_NAME);
	182	+ }
	183	+
	184	+{{/code}}
	185	+
	186	+We also need to change the //homeAction// method so that when an user log ins, he see the list of blog entries.
	187	+
	188	+{{code language="java"}}
	189	+
	190	+public WOComponent homeAction() {
	191	+ return listPageForEntityName(BlogEntry.ENTITY_NAME);
	192	+ }
	193	+
	194	+{{/code}}
	195	+
	196	+Save the file and run the app.
	197	+
	198	+After login, you will see the blog entries and if you click the **Authors** tab, you see the list of authors. Each item in the list have 3 actions by default: **Inspect** (view the object), **Edit** (modify the object) and the red X button to delete the object.
	199	+
	200	+Click **Edit** on an author, and you will see that it display not only the author's details but also blog entries created for that user. You can even create a new blog entry directly from the author.
	201	+
	202	+Now, edit a blog entry. If you click on the field next to the **Creation Date** or **Last Modified**, a calendar widget appears because those two fields are marked as dates in the data model, that's EOF and D2W magic at work.
	203	+
	204	+Viewing or editing a blog entry can be improve. The three things we want to customize:
	205	+
	206	+* to remove the email address of the author when viewing the blog entry
	207	+* to make the **Content** field to be a text area instead of a input field, and even better: attach TinyMCE to the text area
	208	+* modifying the order of attributes when viewing or editing a blog entry so that the title field is the first field, followed by content, the two dates and the author
	209	+
	210	+Those two customizations can be done by adding D2W rules. The D2W rules are in two files, located in the **Resources** folder, **d2w.d2wmodel** and **user.d2wmodel**. To edit the files, make sure you installed RulesModeler, a Mac application that manages D2W rule files. If RuleModeler is present, you can simply double-click on **d2w.d2wmodel** and the file will open in RulesModeler.
	211	+
	212	+The first rule we need to add is a rule to specify that the //richTextMode// will be _ simpleRichTextMode//, which is a built-in definition that will put TinyMCE in a simple configuration. Create the **New** button in RulesModeler, and the rule must looks like this~://
	213	+
	214	+[[image:Capture d’écran 2012-08-05 à 07.22.43.png||border="1"]]
	215	+
	216	+The next rule will specify that we want to use the [[EREditHTML>>http://jenkins.wocommunity.org/job/Wonder/lastSuccessfulBuild/javadoc/er/directtoweb/components/strings/ERDEditHTML.html]] component for the //content// attribute. Again, click **New** in RulesModeler, and add this rule:
	217	+
	218	+[[image:Capture d’écran 2012-08-05 à 07.29.12.png||border="1"]]
	219	+
	220	+Last rule: when we want to inspect or edit the blog entry, we want to change how the attributes are displayed, so add this new rule:
	221	+
	222	+[[image:Capture d’écran 2012-08-05 à 07.30.15.png||border="1"]]
	223	+
	224	+We are done. Save the file in RulesModeler, and run the application again.