You are viewing a plain text version of this content. The canonical link for it is here.
Posted to cvs@cocoon.apache.org by ti...@apache.org on 2004/11/10 21:49:19 UTC
svn commit: rev 57365 - cocoon/trunk/src/blocks/forms/samples/swan/forms
Author: tim
Date: Wed Nov 10 12:49:18 2004
New Revision: 57365
Modified:
cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_binding.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_model.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_template.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/model_binding.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/model_template.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/template_binding.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/template_model.xml
cocoon/trunk/src/blocks/forms/samples/swan/forms/template_template.xml
Log:
Swan: Update to use widget states.
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_binding.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_binding.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_binding.xml Wed Nov 10 12:49:18 2004
@@ -16,7 +16,7 @@
-->
<!--
-Binding for example CForms form binding GUI.
+Binding for Swan form binding editor.
@version CVS $Id$
-->
@@ -34,8 +34,10 @@
<fb:insert-node><fb:aggregate/>
</fb:insert-node>
<fb:struct id="aggregate" path="fd:aggregate">
- <fb:new id="id-class"/>
- <fb:new id="path-class"/>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ <fb:new id="path-class"/>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -46,7 +48,9 @@
<fb:insert-node><fb:class/>
</fb:insert-node>
<fb:struct id="class" path="fb:class">
- <fb:new id="id-class"/>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -57,7 +61,9 @@
<fb:insert-node><fb:javascript/>
</fb:insert-node>
<fb:struct id="javascript" path="fb:javascript">
- <fb:new id="text-class"/>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="text-class"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -67,7 +73,9 @@
<fb:insert-node><fb:new/>
</fb:insert-node>
<fb:struct id="new" path="fb:new">
- <fb:new id="id-class"/>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -77,11 +85,13 @@
<fb:insert-node><fb:repeater/>
</fb:insert-node>
<fb:struct id="repeater" path="fb:repeater">
- <fb:insert-node>
+ <fb:struct id="stuff" path=".">
+ <fb:insert-node>
<fb:on-bind/>
</fb:insert-node>
- <fb:new id="id-class"/>
- <fb:new id="parent-path-class"/>
+ <fb:new id="id-class"/>
+ <fb:new id="parent-path-class"/>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -92,11 +102,13 @@
<fb:insert-node><fb:temp-repeater/>
</fb:insert-node>
<fb:struct id="temp-repeater" path="fb:temp-repeater">
- <fb:new id="id-class"/>
- <fb:new id="parent-path-class"/>
- <fb:insert-node>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ <fb:new id="parent-path-class"/>
+ <fb:insert-node>
<fb:on-bind/>
</fb:insert-node>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -107,11 +119,13 @@
<fb:insert-node><fb:union/>
</fb:insert-node>
<fb:struct id="union" path="fb:union">
- <fb:new id="id-class"/>
- <fb:new id="path-class"/>
- <fb:insert-node>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ <fb:new id="path-class"/>
+ <fb:insert-node>
<fd:widgets/>
</fb:insert-node>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -122,8 +136,10 @@
<fb:insert-node><fb:value/>
</fb:insert-node>
<fb:struct id="value" path="fb:value">
- <fb:new id="id-class"/>
- <fb:value id="path" path="@path"/>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ <fb:value id="path" path="@path"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -133,8 +149,10 @@
<fb:insert-node><fd:struct/>
</fb:insert-node>
<fb:struct id="struct" path="fd:struct">
- <fb:new id="id-class"/>
- <fb:new id="label-class"/>
+ <fb:struct id="stuff" path=".">
+ <fb:new id="id-class"/>
+ <fb:new id="label-class"/>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -178,14 +196,9 @@
</fb:class>
<fb:class id="item-row-class">
- <fb:new id="view-selector-class"/>
<fb:javascript id="type-selector" path="." direction="load">
<fb:load-form>
widget.setValue(jxpathPointer.getNode().getFirstChild().getLocalName());
- if("view".equals(widget.lookupWidget("../view-selector").getValue())) {
- widget.setProcessRequests(false);
- widget.lookupWidget("../union").setProcessRequests(false);
- }
</fb:load-form>
</fb:javascript>
<fb:union id="union" path=".">
@@ -198,6 +211,12 @@
<fb:new id="union-class"/>
<fb:new id="value-class"/>
</fb:union>
+ <!--
+ The view-selector binding must happen last,
+ so that all the widgets will exist that the
+ view-selector's on-value-changed handler needs.
+ -->
+ <fb:new id="view-selector-class"/>
</fb:class>
</fb:context>
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_model.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_model.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_model.xml Wed Nov 10 12:49:18 2004
@@ -23,36 +23,34 @@
CVS $Id$
-->
- <!--
- TODO:
- Add features to "items-class" (e.g. move-up, move-down, add-before, add-after).
- -->
+ <fd:messages id="messages"/>
<fd:new id="items-class"/>
<fd:class id="items-class">
<fd:widgets>
- <fd:repeater id="items" initial-size="1">
- <fd:label>Widgets</fd:label>
+ <fd:repeater id="items" initial-size="0">
+ <fd:label>Items</fd:label>
<fd:widgets>
- <fd:new id="widget-row-class"/>
+ <fd:new id="item-row-class"/>
</fd:widgets>
</fd:repeater>
<fd:repeater-action id="addItem" action-command="add-row" repeater="items">
- <fd:label>New</fd:label>
- </fd:repeater-action>
- <fd:repeater-action id="removeItems" action-command="delete-rows" repeater="items" select="select">
- <fd:label>Delete</fd:label>
+ <fd:label>Add Child</fd:label>
+ <fd:hint>Add child</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var repeater = event.getSourceWidget().lookupWidget("../items");
+ var view = repeater.getRow(repeater.getSize() - 1).getChild("view-selector");
+ view.setValue("edit");
+ // View is selected by buttons.
+ view.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ </javascript>
+ </fd:on-action>
</fd:repeater-action>
</fd:widgets>
</fd:class>
- <fd:class id="select-class">
- <fd:widgets>
- <fd:booleanfield id="select"><fd:label>Select</fd:label></fd:booleanfield>
- </fd:widgets>
- </fd:class>
-
<fd:class id="view-selector-class">
<fd:widgets>
<fd:field id="view-selector">
@@ -66,39 +64,74 @@
<fd:on-value-changed>
<javascript>
var widget = event.getSourceWidget();
- //var parent = widget.getParent();
- //var union = parent.getChild("union");
- //var type = parent.getChild("type-selector");
var union = widget.lookupWidget("../union");
var type = widget.lookupWidget("../type-selector");
- if(widget.getValue().equals("edit")) {
- union.setProcessRequests(true);
- type.setProcessRequests(true);
+ var stuff = union.lookupWidget(union.getValue() + "/stuff");
+ if("edit".equals(widget.getValue())) {
+ union.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ if(stuff != null) {
+ stuff.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ }
+ type.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ } else if("view".equals(widget.getValue())){
+ union.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ if(stuff != null) {
+ stuff.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ }
+ type.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
} else {
- union.setProcessRequests(false);
- type.setProcessRequests(false);
+ union.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ type.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
}
</javascript>
</fd:on-value-changed>
</fd:field>
+ <fd:action id="fold-view" action-command="fold-view">
+ <fd:label>F</fd:label>
+ <fd:hint>Fold</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var view = event.getSourceWidget().lookupWidget("../view-selector");
+ view.value="fold";
+ </javascript>
+ </fd:on-action>
+ </fd:action>
+ <fd:action id="view-view" action-command="view-view">
+ <fd:label>V</fd:label>
+ <fd:hint>View</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var view = event.getSourceWidget().lookupWidget("../view-selector");
+ view.value="view";
+ </javascript>
+ </fd:on-action>
+ </fd:action>
+ <fd:action id="edit-view" action-command="edit-view">
+ <fd:label>E</fd:label>
+ <fd:hint>Edit</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var view = event.getSourceWidget().lookupWidget("../view-selector");
+ view.value="edit";
+ </javascript>
+ </fd:on-action>
+ </fd:action>
</fd:widgets>
</fd:class>
<fd:class id="type-selector-class">
<fd:widgets>
<fd:field id="type-selector">
- <fd:label>Widget Type</fd:label>
+ <fd:label>Type</fd:label>
<fd:datatype base="string"/>
<fd:selection-list>
<fd:item value=""><fd:label>Nothing</fd:label></fd:item>
- <fd:item value="class"><fd:label>Class</fd:label></fd:item>
- <fd:item value="new"><fd:label>New</fd:label></fd:item>
- <fd:item value="value"><fd:label>Value</fd:label></fd:item>
-
<fd:item value="action"><fd:label>Action</fd:label></fd:item>
<fd:item value="aggregatefield"><fd:label>AggregateField</fd:label></fd:item>
<fd:item value="booleanfield"><fd:label>BooleanField</fd:label></fd:item>
+ <fd:item value="class"><fd:label>Class</fd:label></fd:item>
<fd:item value="field"><fd:label>Field</fd:label></fd:item>
+ <fd:item value="new"><fd:label>New</fd:label></fd:item>
<fd:item value="output"><fd:label>Output</fd:label></fd:item>
<fd:item value="repeater"><fd:label>Repeater</fd:label></fd:item>
<fd:item value="temp-repeater"><fd:label>Repeater</fd:label></fd:item>
@@ -106,25 +139,62 @@
<fd:item value="struct"><fd:label>Struct</fd:label></fd:item>
<fd:item value="submit"><fd:label>Submit</fd:label></fd:item>
<fd:item value="union"><fd:label>Union</fd:label></fd:item>
+ <fd:item value="value"><fd:label>Value</fd:label></fd:item>
</fd:selection-list>
</fd:field>
</fd:widgets>
</fd:class>
- <fd:class id="widget-row-class">
+ <fd:class id="item-row-class">
<fd:widgets>
- <fd:new id="select-class"/>
+
+ <fd:row-action id="up" action-command="move-up">
+ <fd:label>^</fd:label>
+ <fd:hint>Move up</fd:hint>
+ </fd:row-action>
+
+ <fd:row-action id="down" action-command="move-down">
+ <fd:label>v</fd:label>
+ <fd:hint>Move down</fd:hint>
+ </fd:row-action>
+
+ <fd:row-action id="add" action-command="add-after">
+ <fd:label>+</fd:label>
+ <fd:hint>Add after</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var cur_row = Packages.org.apache.cocoon.forms.formmodel.Repeater.getParentRow(event.getSourceWidget());
+ var repeater = cur_row.getParent();
+ var new_row = repeater.getChild(repeater.indexOf(cur_row)+1);
+ var view = new_row.getChild("view-selector");
+ view.setValue("edit");
+ // View is selected by buttons.
+ view.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ </javascript>
+ </fd:on-action>
+ </fd:row-action>
+
+ <fd:row-action id="delete" action-command="delete">
+ <fd:label>X</fd:label>
+ <fd:hint>Delete</fd:hint>
+ </fd:row-action>
+
<fd:new id="view-selector-class"/>
+
<fd:new id="type-selector-class"/>
+
<fd:union id="union" default="" case="type-selector">
- <fd:datatype base="string"/>
<fd:label>Type</fd:label>
<fd:widgets>
<fd:struct id="class">
<fd:label>Class</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -132,23 +202,35 @@
<fd:struct id="javascript">
<fd:label>Javascript</fd:label>
<fd:widgets>
- <fd:new id="text-class"/>
- <fd:new id="path-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="text-class"/>
+ <fd:new id="path-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="new">
<fd:label>New</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="union">
<fd:label>Union</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="path-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="path-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -156,8 +238,12 @@
<fd:struct id="value">
<fd:label>Value</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="path-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="path-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
@@ -165,17 +251,25 @@
<fd:struct id="action">
<fd:label>Action</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="aggregatefield">
<fd:label>AggregateField</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
- <fd:new id="required-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ <fd:new id="required-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -183,34 +277,50 @@
<fd:struct id="booleanfield">
<fd:label>BooleanField</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="field">
<fd:label>Field</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
- <fd:new id="required-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ <fd:new id="required-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="output">
<fd:label>Output</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="repeater">
<fd:label>Repeater</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
- <fd:new id="initial-size-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ <fd:new id="initial-size-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -218,8 +328,12 @@
<fd:struct id="temp-repeater">
<fd:label>Repeater</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="parent-path-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="parent-path-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -227,16 +341,24 @@
<fd:struct id="row-action">
<fd:label>RowAction</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="struct">
<fd:label>Struct</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -244,8 +366,12 @@
<fd:struct id="submit">
<fd:label>Submit</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_template.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_template.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/binding_template.xml Wed Nov 10 12:49:18 2004
@@ -18,20 +18,50 @@
xmlns:ft="http://apache.org/cocoon/forms/1.0#template"
xmlns:fi="http://apache.org/cocoon/forms/1.0#instance">
- <!--
- CVS $Id: form_model_gui_template.xml,v 1.2 2004/04/12 14:05:09 tim Exp $
- -->
-
- <!--
- TODO: Add features to "items-class" (e.g. move-up, move-down, add-before, add-after).
- -->
+ <!--
+ CVS $Id$
+ -->
+
+ <style type="text/css">
+ li {
+ list-style-type: none
+ }
+
+ /* The actions buttons, placed on the right */
+ .actions {
+ float: right;
+ padding-top: 0.2em;
+ }
+
+ /* A "section" contains stuff, related actions and substuff */
+ div.section {
+ padding-top: 0.4em;
+ padding-bottom: 0.4em;
+ padding-left: 0.4em;
+ border: 1px dotted black;
+ mmargin-top: 0.4em;
+ margin-bottom: -1px;
+ }
+
+ /* Indent sub-sections (recursively) */
+ div.section div.section {
+ margin-left: 3em;
+ border-right: none;
+ }
+
+ /* Change bg color depending on nesting depth */
+ div.section div.section { background-color: #F0F0F0; }
+ div.section div.section div.section { background-color: #E0E0E0; }
+ div.section div.section div.section div.section { background-color: #D0D0D0; }
+ div.section div.section div.section div.section div.section { background-color: #C0C0C0; }
+ </style>
- <title>Form Binding Editor</title>
+ <title>Swan Form Binding Editor</title>
<content>
<ft:form-template action="#{$continuation/id}.continue" method="POST">
- <ft:class id="output-id-class">
+ <ft:class id="out-id-class">
<b><ft:widget-label id="id"/>:</b>
<ft:widget id="id">
<fi:styling type="output"/>
@@ -67,13 +97,19 @@
<ft:class id="std-id-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -81,14 +117,20 @@
<ft:class id="std-id-items-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
</ft:choose>
@@ -97,15 +139,21 @@
<ft:class id="std-id-label-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
- <ft:new id="output-label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-label-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
- <ft:new id="label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ <ft:new id="label-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -113,16 +161,22 @@
<ft:class id="std-id-label-items-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
- <ft:new id="output-label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-label-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
- <ft:new id="label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ <ft:new id="label-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
</ft:choose>
@@ -131,16 +185,22 @@
<ft:class id="std-id-path-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
- <ft:new id="output-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-path-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
- <ft:new id="output-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-path-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
- <ft:new id="path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ <ft:new id="path-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -148,17 +208,23 @@
<ft:class id="std-id-path-items-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
- <ft:new id="output-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-path-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
- <ft:new id="output-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-path-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
- <ft:new id="path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ <ft:new id="path-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
</ft:choose>
@@ -167,13 +233,19 @@
<ft:class id="std-javascript-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-text-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-text-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-text-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-text-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="text-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="text-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -181,15 +253,21 @@
<ft:class id="std-path-items-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-path-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-path-class"/>
- <ft:new id="items-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-path-class"/>
+ <ft:new id="items-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="path-class"/>
- <ft:new id="items-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="path-class"/>
+ <ft:new id="items-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -197,18 +275,24 @@
<ft:class id="std-repeater-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
- <ft:new id="output-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-path-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
- <ft:new id="output-parent-path-class"/>
- <ft:new id="items-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-parent-path-class"/>
+ <ft:new id="items-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
- <ft:new id="parent-path-class"/>
- <ft:new id="items-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ <ft:new id="parent-path-class"/>
+ <ft:new id="items-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -216,17 +300,23 @@
<ft:class id="std-temp-repeater-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
- <ft:new id="output-parent-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-parent-path-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
- <ft:new id="output-parent-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="out-id-class"/>
+ <ft:new id="output-parent-path-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
- <ft:new id="parent-path-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ <ft:new id="parent-path-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
</ft:choose>
@@ -318,37 +408,47 @@
</ft:class>
<ft:class id="view-selector-class">
- <ft:widget id="view-selector">
- <fi:styling list-type="dropdown" submit-on-change="true"/>
- </ft:widget>
+ <ft:choose path="view-selector">
+ <ft:when value="fold">
+ <ft:widget id="view-view"><fi:styling type="image" src="resources/view.gif"/></ft:widget>
+ <ft:widget id="edit-view"><fi:styling type="image" src="resources/edit.gif"/></ft:widget>
+ </ft:when>
+ <ft:when value="view">
+ <ft:widget id="fold-view"><fi:styling type="image" src="resources/fold.gif"/></ft:widget>
+ <ft:widget id="edit-view"><fi:styling type="image" src="resources/edit.gif"/></ft:widget>
+ </ft:when>
+ <ft:when value="edit">
+ <ft:widget id="fold-view"><fi:styling type="image" src="resources/fold.gif"/></ft:widget>
+ <ft:widget id="view-view"><fi:styling type="image" src="resources/view.gif"/></ft:widget>
+ </ft:when>
+ </ft:choose>
+ </ft:class>
+
+ <ft:class id="item-row-class">
+ <span class="actions">
+ <ft:widget id="up"><fi:styling type="image" src="resources/move_up.gif"/></ft:widget>
+ <ft:widget id="down"><fi:styling type="image" src="resources/move_down.gif"/></ft:widget>
+ <ft:widget id="add"><fi:styling type="image" src="resources/new.gif"/></ft:widget>
+  <ft:widget id="delete"><fi:styling type="image" src="resources/delete.gif"/></ft:widget>
+ </span>
+ <ft:new id="view-selector-class"/>
+ <ft:new id="type-selector-class"/>
+ <ft:new id="union-class"/>
</ft:class>
<ft:class id="items-class">
+ <ft:widget id="addItem"><fi:styling type="image" src="resources/new_child.gif"/></ft:widget>
<ft:repeater-size id="items"/>
- <ul>
- <ft:repeater-widget id="items">
- <li>
- <ft:widget id="select"/>
- <ft:new id="view-selector-class"/>
- <ft:new id="type-selector-class"/>
- <ft:new id="union-class"/>
- </li>
- </ft:repeater-widget>
- </ul>
- <ft:widget id="addItem"/>
- <ft:widget id="removeItems"/><br/>
- </ft:class>
-
- <table border="3">
- <tr>
- <td>
- <p>
- <ft:new id="items-class"/>
- </p>
- <input type="submit"/>
- </td>
- </tr>
- </table>
+ <ft:repeater-widget id="items">
+ <div class="section"><ft:new id="item-row-class"/></div>
+ </ft:repeater-widget>
+ </ft:class>
+
+ <p>
+ <ft:new id="items-class"/>
+ </p>
+ <ft:widget id="messages"/><br/>
+ <input type="submit"/>
</ft:form-template>
</content>
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/model_binding.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/model_binding.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/model_binding.xml Wed Nov 10 12:49:18 2004
@@ -16,7 +16,7 @@
-->
<!--
-Binding for example CForms form model GUI.
+Binding for Swan form model editor.
@version CVS $Id: form_model_gui_binding.xml,v 1.3 2004/04/12 14:05:09 tim Exp $
-->
@@ -232,7 +232,8 @@
<fb:class id="item-row-class">
<fb:javascript id="type-selector" path="." direction="load">
<fb:load-form>
- widget.setValue(jxpathPointer.getNode().getFirstChild().getLocalName());
+ var node = jxpathPointer.getNode().getFirstChild();
+ widget.setValue(node.getLocalName());
</fb:load-form>
</fb:javascript>
<fb:union id="union" path=".">
@@ -258,7 +259,7 @@
</fb:class>
<fb:class id="label-class">
- <fb:value id="label" path="fd:label"/>
+ <fb:value id="label" path="fd:label"/>
</fb:class>
</fb:context>
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/model_template.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/model_template.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/model_template.xml Wed Nov 10 12:49:18 2004
@@ -56,7 +56,7 @@
div.section div.section div.section div.section div.section { background-color: #C0C0C0; }
</style>
- <title>Form Model Editor</title>
+ <title>Swam Form Model Editor</title>
<content>
<ft:form-template action="#{$continuation/id}.continue" method="POST">
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/template_binding.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/template_binding.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/template_binding.xml Wed Nov 10 12:49:18 2004
@@ -16,7 +16,7 @@
-->
<!--
-Binding for CForms form template editor.
+Binding for Swan form template editor.
@version CVS $Id$
-->
@@ -34,7 +34,9 @@
<fb:insert-node><ft:case/>
</fb:insert-node>
<fb:struct id="case" path="ft:case">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -45,7 +47,9 @@
<fb:insert-node><ft:class/>
</fb:insert-node>
<fb:struct id="class" path="ft:class">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -56,6 +60,8 @@
<fb:insert-node><ft:form-template/>
</fb:insert-node>
<fb:struct id="form-template" path="ft:form-template">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -66,7 +72,9 @@
<fb:insert-node><ft:new/>
</fb:insert-node>
<fb:struct id="new" path="ft:new">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -76,7 +84,9 @@
<fb:insert-node><ft:repeater-size/>
</fb:insert-node>
<fb:struct id="repeater-size" path="ft:repeater-size">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -86,8 +96,10 @@
<fb:insert-node><ft:repeater-widget/>
</fb:insert-node>
<fb:struct id="repeater-widget" path="ft:repeater-widget">
- <fb:value id="id" path="@id"/>
- <fb:insert-node></fb:insert-node>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ <fb:insert-node></fb:insert-node>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -98,11 +110,13 @@
<fb:insert-node><ft:struct/>
</fb:insert-node>
<fb:struct id="struct" path="ft:struct">
- <fb:value id="id" path="@id"/>
- <fb:new id="label-class"/>
- <fb:insert-node>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ <fb:new id="label-class"/>
+ <fb:insert-node>
<ft:widgets/>
</fb:insert-node>
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -113,7 +127,9 @@
<fb:insert-node><ft:union/>
</fb:insert-node>
<fb:struct id="union" path="ft:union">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
<!--<ft:new id="label-class"/>-->
<fb:new id="items-class"/>
</fb:struct>
@@ -125,7 +141,9 @@
<fb:insert-node><ft:widget/>
</fb:insert-node>
<fb:struct id="widget" path="ft:widget">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -135,7 +153,9 @@
<fb:insert-node><ft:widget-label/>
</fb:insert-node>
<fb:struct id="widget-label" path="ft:widget-label">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
</fb:struct>
</fb:case>
</fb:class>
@@ -145,6 +165,8 @@
<fb:case id="table" path=".">
<fb:insert-node><table/></fb:insert-node>
<fb:struct id="table" path="table">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -152,6 +174,8 @@
<fb:case id="tr" path=".">
<fb:insert-node><tr/></fb:insert-node>
<fb:struct id="tr" path="tr">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -159,6 +183,8 @@
<fb:case id="td" path=".">
<fb:insert-node><td/></fb:insert-node>
<fb:struct id="td" path="td">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -166,6 +192,8 @@
<fb:case id="p" path=".">
<fb:insert-node><p/></fb:insert-node>
<fb:struct id="p" path="p">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -173,13 +201,17 @@
<fb:case id="input" path=".">
<fb:insert-node><input/></fb:insert-node>
<fb:struct id="input" path="input">
- <fb:value id="id" path="@id"/>
+ <fb:struct id="stuff" path=".">
+ <fb:value id="id" path="@id"/>
+ </fb:struct>
</fb:struct>
</fb:case>
<fb:case id="content" path=".">
<fb:insert-node><content/></fb:insert-node>
<fb:struct id="content" path="content">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -187,6 +219,8 @@
<fb:case id="title" path=".">
<fb:insert-node><title/></fb:insert-node>
<fb:struct id="title" path="title">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
@@ -194,20 +228,20 @@
<fb:case id="page" path=".">
<fb:insert-node><page/></fb:insert-node>
<fb:struct id="page" path="page">
+ <fb:struct id="stuff" path=".">
+ </fb:struct>
<fb:new id="items-class"/>
</fb:struct>
</fb:case>
</fb:class>
- <fb:class id="label-class">
- <fb:value id="label" path="ft:label"/>
- </fb:class>
-
<fb:class id="view-selector-class">
<fb:javascript id="view-selector" path="." direction="load">
<fb:load-form>
- widget.setValue("edit");
+ widget.setValue("view");
+ // View is selected by buttons.
+ widget.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
</fb:load-form>
</fb:javascript>
</fb:class>
@@ -222,14 +256,11 @@
</fb:class>
<fb:class id="item-row-class">
- <fb:new id="view-selector-class"/>
- <fb:javascript id="type-selector" path=".">
+ <fb:javascript id="type-selector" path="." direction="load">
<fb:load-form>
var node = jxpathPointer.getNode().getFirstChild();
widget.setValue(node.getLocalName());
</fb:load-form>
- <fb:save-form>
- </fb:save-form>
</fb:javascript>
<fb:union id="union" path=".">
<fb:new id="case-class"/>
@@ -244,6 +275,16 @@
<fb:new id="widget-label-class"/>
<fb:new id="default-class"/>
</fb:union>
+ <!--
+ The view-selector binding must happen last,
+ so that all the widgets will exist that the
+ view-selector's on-value-changed handler needs.
+ -->
+ <fb:new id="view-selector-class"/>
+ </fb:class>
+
+ <fb:class id="label-class">
+ <fb:value id="label" path="ft:label"/>
</fb:class>
</fb:context>
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/template_model.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/template_model.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/template_model.xml Wed Nov 10 12:49:18 2004
@@ -23,36 +23,34 @@
CVS $Id$
-->
- <!--
- TODO:
- Add features to "items-class" (e.g. move-up, move-down, add-before, add-after).
- -->
+ <fd:messages id="messages"/>
<fd:new id="items-class"/>
<fd:class id="items-class">
<fd:widgets>
<fd:repeater id="items" initial-size="0">
- <fd:label>Widget Templates</fd:label>
+ <fd:label>Items</fd:label>
<fd:widgets>
<fd:new id="item-row-class"/>
</fd:widgets>
</fd:repeater>
<fd:repeater-action id="addItem" action-command="add-row" repeater="items">
- <fd:label>New</fd:label>
- </fd:repeater-action>
- <fd:repeater-action id="removeItems" action-command="delete-rows" repeater="items" select="select">
- <fd:label>Delete</fd:label>
+ <fd:label>Add Child</fd:label>
+ <fd:hint>Add child</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var repeater = event.getSourceWidget().lookupWidget("../items");
+ var view = repeater.getRow(repeater.getSize() - 1).getChild("view-selector");
+ view.setValue("edit");
+ // View is selected by buttons.
+ view.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ </javascript>
+ </fd:on-action>
</fd:repeater-action>
</fd:widgets>
</fd:class>
- <fd:class id="select-class">
- <fd:widgets>
- <fd:booleanfield id="select"><fd:label>Select</fd:label></fd:booleanfield>
- </fd:widgets>
- </fd:class>
-
<fd:class id="view-selector-class">
<fd:widgets>
<fd:field id="view-selector">
@@ -66,21 +64,58 @@
<fd:on-value-changed>
<javascript>
var widget = event.getSourceWidget();
- //var parent = widget.getParent();
- //var union = parent.getChild("union");
- //var type = parent.getChild("type-selector");
var union = widget.lookupWidget("../union");
var type = widget.lookupWidget("../type-selector");
- if("edit".equals(event.getNewValue())) {
- union.setProcessRequests(true);
- type.setProcessRequests(true);
+ var stuff = union.lookupWidget(union.getValue() + "/stuff");
+ if("edit".equals(widget.getValue())) {
+ union.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ if(stuff != null) {
+ stuff.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ }
+ type.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ } else if("view".equals(widget.getValue())){
+ union.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.ACTIVE);
+ if(stuff != null) {
+ stuff.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ }
+ type.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
} else {
- union.setProcessRequests(false);
- type.setProcessRequests(false);
+ union.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ type.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
}
</javascript>
</fd:on-value-changed>
</fd:field>
+ <fd:action id="fold-view" action-command="fold-view">
+ <fd:label>F</fd:label>
+ <fd:hint>Fold</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var view = event.getSourceWidget().lookupWidget("../view-selector");
+ view.value="fold";
+ </javascript>
+ </fd:on-action>
+ </fd:action>
+ <fd:action id="view-view" action-command="view-view">
+ <fd:label>V</fd:label>
+ <fd:hint>View</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var view = event.getSourceWidget().lookupWidget("../view-selector");
+ view.value="view";
+ </javascript>
+ </fd:on-action>
+ </fd:action>
+ <fd:action id="edit-view" action-command="edit-view">
+ <fd:label>E</fd:label>
+ <fd:hint>Edit</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var view = event.getSourceWidget().lookupWidget("../view-selector");
+ view.value="edit";
+ </javascript>
+ </fd:on-action>
+ </fd:action>
</fd:widgets>
</fd:class>
@@ -118,18 +153,54 @@
<fd:class id="item-row-class">
<fd:widgets>
- <fd:new id="select-class"/>
+
+ <fd:row-action id="up" action-command="move-up">
+ <fd:label>^</fd:label>
+ <fd:hint>Move up</fd:hint>
+ </fd:row-action>
+
+ <fd:row-action id="down" action-command="move-down">
+ <fd:label>v</fd:label>
+ <fd:hint>Move down</fd:hint>
+ </fd:row-action>
+
+ <fd:row-action id="add" action-command="add-after">
+ <fd:label>+</fd:label>
+ <fd:hint>Add after</fd:hint>
+ <fd:on-action>
+ <javascript>
+ var cur_row = Packages.org.apache.cocoon.forms.formmodel.Repeater.getParentRow(event.getSourceWidget());
+ var repeater = cur_row.getParent();
+ var new_row = repeater.getChild(repeater.indexOf(cur_row)+1);
+ var view = new_row.getChild("view-selector");
+ view.setValue("edit");
+ // View is selected by buttons.
+ view.setState(Packages.org.apache.cocoon.forms.formmodel.WidgetState.DISABLED);
+ </javascript>
+ </fd:on-action>
+ </fd:row-action>
+
+ <fd:row-action id="delete" action-command="delete">
+ <fd:label>X</fd:label>
+ <fd:hint>Delete</fd:hint>
+ </fd:row-action>
+
<fd:new id="view-selector-class"/>
+
<fd:new id="type-selector-class"/>
+
<fd:union id="union" default="" case="type-selector">
- <fd:datatype base="string"/>
<fd:label>Type</fd:label>
<fd:widgets>
<fd:struct id="case">
<fd:label>Case</fd:label>
<fd:widgets>
- <fd:new id="id-not-req-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-not-req-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -137,7 +208,11 @@
<fd:struct id="class">
<fd:label>Class</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -145,6 +220,10 @@
<fd:struct id="form-template">
<fd:label>Form Template</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -152,21 +231,33 @@
<fd:struct id="new">
<fd:label>New</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="repeater-size">
<fd:label>Repeater Size</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="repeater-widget">
<fd:label>Repeater Widget</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -174,8 +265,12 @@
<fd:struct id="struct">
<fd:label>Struct</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -183,8 +278,12 @@
<fd:struct id="union">
<fd:label>Union</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
- <fd:new id="label-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ <fd:new id="label-class"/>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -192,27 +291,43 @@
<fd:struct id="widget">
<fd:label>Widget</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="widget-label">
<fd:label>Widget Label</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="default">
<fd:label>Default</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="table">
<fd:label>Table</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -220,6 +335,10 @@
<fd:struct id="tr">
<fd:label>Table Row</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -227,6 +346,10 @@
<fd:struct id="td">
<fd:label>Table Data</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -234,6 +357,10 @@
<fd:struct id="p">
<fd:label>Paragraph</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -241,13 +368,21 @@
<fd:struct id="input">
<fd:label>Input</fd:label>
<fd:widgets>
- <fd:new id="id-class"/>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ <fd:new id="id-class"/>
+ </fd:widgets>
+ </fd:struct>
</fd:widgets>
</fd:struct>
<fd:struct id="content">
<fd:label>Content</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -255,6 +390,10 @@
<fd:struct id="title">
<fd:label>Title</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
@@ -262,6 +401,10 @@
<fd:struct id="page">
<fd:label>Page</fd:label>
<fd:widgets>
+ <fd:struct id="stuff">
+ <fd:widgets>
+ </fd:widgets>
+ </fd:struct>
<fd:new id="items-class"/>
</fd:widgets>
</fd:struct>
Modified: cocoon/trunk/src/blocks/forms/samples/swan/forms/template_template.xml
==============================================================================
--- cocoon/trunk/src/blocks/forms/samples/swan/forms/template_template.xml (original)
+++ cocoon/trunk/src/blocks/forms/samples/swan/forms/template_template.xml Wed Nov 10 12:49:18 2004
@@ -18,15 +18,45 @@
xmlns:ft="http://apache.org/cocoon/forms/1.0#template"
xmlns:fi="http://apache.org/cocoon/forms/1.0#instance">
- <!--
- CVS $Id$
- -->
-
- <!--
- TODO: Add features to "items-class" (e.g. move-up, move-down, add-before, add-after).
- -->
+ <!--
+ CVS $Id$
+ -->
+
+ <style type="text/css">
+ li {
+ list-style-type: none
+ }
+
+ /* The actions buttons, placed on the right */
+ .actions {
+ float: right;
+ padding-top: 0.2em;
+ }
+
+ /* A "section" contains stuff, related actions and substuff */
+ div.section {
+ padding-top: 0.4em;
+ padding-bottom: 0.4em;
+ padding-left: 0.4em;
+ border: 1px dotted black;
+ mmargin-top: 0.4em;
+ margin-bottom: -1px;
+ }
+
+ /* Indent sub-sections (recursively) */
+ div.section div.section {
+ margin-left: 3em;
+ border-right: none;
+ }
+
+ /* Change bg color depending on nesting depth */
+ div.section div.section { background-color: #F0F0F0; }
+ div.section div.section div.section { background-color: #E0E0E0; }
+ div.section div.section div.section div.section { background-color: #D0D0D0; }
+ div.section div.section div.section div.section div.section { background-color: #C0C0C0; }
+ </style>
- <title>Form Template Editor</title>
+ <title>Swan Form Template Editor</title>
<content>
<ft:form-template action="#{$continuation/id}.continue" method="POST">
@@ -56,13 +86,19 @@
<ft:class id="std-id-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -70,13 +106,19 @@
<ft:class id="std-label-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-label-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-label-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="edit">
- <ft:new id="label-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="label-class"/>
+ </ft:struct>
</ft:when>
</ft:choose>
</ft:class>
@@ -84,11 +126,17 @@
<ft:class id="std-items-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
+ <ft:struct id="stuff">
+ </ft:struct>
</ft:when>
<ft:when value="view">
+ <ft:struct id="stuff">
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
<ft:when value="edit">
+ <ft:struct id="stuff">
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
</ft:choose>
@@ -97,14 +145,20 @@
<ft:class id="std-id-items-class">
<ft:choose path="../../view-selector">
<ft:when value="fold">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-id-class"/>
+ </ft:struct>
</ft:when>
<ft:when value="view">
- <ft:new id="output-id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="output-id-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
<ft:when value="edit">
- <ft:new id="id-class"/>
+ <ft:struct id="stuff">
+ <ft:new id="id-class"/>
+ </ft:struct>
<ft:new id="items-class"/>
</ft:when>
</ft:choose>
@@ -251,42 +305,48 @@
</ft:choose>
</ft:class>
- <!-- DEBUG -->
- <!--
- <fi:styling list-type="dropdown" submit-on-change="true"/>
- -->
<ft:class id="view-selector-class">
- <ft:widget id="view-selector">
- <fi:styling submit-on-change="true"/>
- </ft:widget>
+ <ft:choose path="view-selector">
+ <ft:when value="fold">
+ <ft:widget id="view-view"><fi:styling type="image" src="resources/view.gif"/></ft:widget>
+ <ft:widget id="edit-view"><fi:styling type="image" src="resources/edit.gif"/></ft:widget>
+ </ft:when>
+ <ft:when value="view">
+ <ft:widget id="fold-view"><fi:styling type="image" src="resources/fold.gif"/></ft:widget>
+ <ft:widget id="edit-view"><fi:styling type="image" src="resources/edit.gif"/></ft:widget>
+ </ft:when>
+ <ft:when value="edit">
+ <ft:widget id="fold-view"><fi:styling type="image" src="resources/fold.gif"/></ft:widget>
+ <ft:widget id="view-view"><fi:styling type="image" src="resources/view.gif"/></ft:widget>
+ </ft:when>
+ </ft:choose>
+ </ft:class>
+
+ <ft:class id="item-row-class">
+ <span class="actions">
+ <ft:widget id="up"><fi:styling type="image" src="resources/move_up.gif"/></ft:widget>
+ <ft:widget id="down"><fi:styling type="image" src="resources/move_down.gif"/></ft:widget>
+ <ft:widget id="add"><fi:styling type="image" src="resources/new.gif"/></ft:widget>
+  <ft:widget id="delete"><fi:styling type="image" src="resources/delete.gif"/></ft:widget>
+ </span>
+ <ft:new id="view-selector-class"/>
+ <ft:new id="type-selector-class"/>
+ <ft:new id="union-class"/>
</ft:class>
<ft:class id="items-class">
+ <ft:widget id="addItem"><fi:styling type="image" src="resources/new_child.gif"/></ft:widget>
<ft:repeater-size id="items"/>
- <ul>
- <ft:repeater-widget id="items">
- <li>
- <ft:new id="view-selector-class"/>
- <ft:new id="type-selector-class"/>
- <ft:new id="union-class"/>
- </li>
- </ft:repeater-widget>
- </ul>
- <ft:widget id="addItem"/>
- <ft:widget id="removeItems"/><br/>
- </ft:class>
-
- <table border="3">
- <tr>
- <td>
- <p>
- <ft:new id="items-class"/>
- </p>
- <fi:validation-errors/>
- <input type="submit"/>
- </td>
- </tr>
- </table>
+ <ft:repeater-widget id="items">
+ <div class="section"><ft:new id="item-row-class"/></div>
+ </ft:repeater-widget>
+ </ft:class>
+
+ <p>
+ <ft:new id="items-class"/>
+ </p>
+ <ft:widget id="messages"/><br/>
+ <input type="submit"/>
</ft:form-template>
</content>