[Checkins] SVN: z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/ Tree
demo now makes liberal use of new jsclientevent module and
has somewhat better css.
Paul Carduner
paulcarduner at gmail.com
Tue Aug 21 23:55:12 EDT 2007
Log message for revision 79110:
Tree demo now makes liberal use of new jsclientevent module and has somewhat better css.
Changed:
U z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/browser.py
U z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/inline.pt
U z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/tree.css
U z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/treenode.pt
-=-
Modified: z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/browser.py
===================================================================
--- z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/browser.py 2007-08-22 01:26:38 UTC (rev 79109)
+++ z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/browser.py 2007-08-22 03:55:11 UTC (rev 79110)
@@ -21,12 +21,15 @@
from zope.publisher.interfaces.browser import IBrowserPage
from zope.component import getMultiAdapter
from zope.publisher.interfaces import IPublishTraverse
+from zope.lifecycleevent.interfaces import IObjectModifiedEvent
+from zope.component.interfaces import IObjectEvent
+from zope.app.container.interfaces import IObjectAddedEvent
from z3c.form import form, field, button
from z3c.formui import layout
from z3c.form.interfaces import IWidgets, DISPLAY_MODE
-from z3c.formjs import jsaction, jsfunction
+from z3c.formjs import jsaction, jsfunction, jsclientevent
from z3c.formjs.interfaces import IJSButton
import tree, interfaces
@@ -39,12 +42,18 @@
@property
def prefix(self):
- return '%s-%s' % (hash(absoluteURL(self,
- self.request)),
- self.postfix)
+ url = absoluteURL(self.context, self.request)
+ return '-'.join((str(hash(url)), str(self.postfix)))
-class TreeNodeInlineAddForm(PrefixForm, form.AddForm):
+class EventsForm(jsclientevent.ClientEventsForm):
+
+ @jsclientevent.listener((interfaces.ITreeNode, IObjectEvent))
+ def updateEventList(self, event):
+ info = repr(event).replace('<','<').replace('>','>').replace('"',"'")
+ return '$("#server-events-container").append("<div>%s</div>")' % info
+
+class TreeNodeInlineAddForm(PrefixForm, EventsForm, form.AddForm):
"""Form for adding a tree node.
This page is meant to be inlined into another page.
@@ -52,7 +61,15 @@
label = "Add a Tree Node"
fields = field.Fields(interfaces.ITreeNode).select('title')
postfix = 'add'
+ jsClientListeners = EventsForm.jsClientListeners
+ @jsclientevent.listener((interfaces.ITreeNode, IObjectAddedEvent))
+ def updateContents(self, event):
+ indexForm = TreeNodeInlineForm(self.context, self.request)
+ indexForm.update()
+ expandId = indexForm.actions['expand'].id
+ return '$("#%s").click()' % expandId
+
def create(self, data):
return tree.TreeNode(data['title'])
@@ -66,7 +83,7 @@
def render(self):
"""Custom render method that does not use nextURL method."""
if self._finishedAdd:
- return ""
+ return '<script type="text/javascript">%s</script>' % self.eventInjections
return super(TreeNodeInlineAddForm, self).render()
@@ -117,10 +134,11 @@
contract = jsaction.JSButton(title=u'-')
-class TreeNodeInlineForm(PrefixForm, form.Form):
+class TreeNodeInlineForm(PrefixForm, EventsForm, form.Form):
fields = field.Fields(interfaces.ITreeNode).select('title')
buttons = button.Buttons(IButtons)
+ jsClientListeners = EventsForm.jsClientListeners
@jsaction.handler(buttons['expand'])
def handleExpand(self, event, selector):
@@ -147,9 +165,10 @@
self.widgets.update()
-class TreeNodeInlineEditForm(PrefixForm, form.EditForm):
+class TreeNodeInlineEditForm(PrefixForm, EventsForm, form.EditForm):
fields = field.Fields(interfaces.ITreeNode).select('title')
+ jsClientListeners = EventsForm.jsClientListeners
_applyChangesWasCalled = False
@@ -157,9 +176,16 @@
self._applyChangesWasCalled = True
return super(TreeNodeInlineEditForm, self).applyChanges(data)
+ @jsclientevent.listener((interfaces.ITreeNode, IObjectModifiedEvent))
+ def updateTitle(self, event):
+ inlineform = TreeNodeInlineForm(self.context, self.request)
+ inlineform.update()
+ titleId = inlineform.widgets['title'].id
+ return '$("#%s").html("%s")' % (titleId, self.context.title)
+
def render(self):
if self._applyChangesWasCalled:
- return self.context.title
+ return '<script type="text/javascript">%s</script>' % self.eventInjections
else:
return super(TreeNodeInlineEditForm, self).render()
@@ -185,33 +211,23 @@
buttons = button.Buttons(IContentButtons)
- def _handleInlineFormButton(self, viewURL, func):
+ def _handleInlineFormButton(self, viewURL):
return '''$.get("%s",
function(data){
$("#%s-inlineform").html(data);
$("#%s-inlineform form").ajaxForm(
function(data){
- %s
+ $("body").append(data);
});
});
- ''' % (viewURL, self.prefix, self.prefix, func)
+ ''' % (viewURL, self.prefix, self.prefix)
@jsaction.handler(buttons['add'])
def handleAdd(self, event, selector):
viewURL = absoluteURL(self.context, self.request) + '/@@add'
- indexForm = getMultiAdapter((self.context, self.request), IBrowserPage,
- name='inline')
- indexForm.update()
- widgetId = indexForm.actions['expand'].id
- func = '$("#%s").click()' % widgetId
- return self._handleInlineFormButton(viewURL, func)
+ return self._handleInlineFormButton(viewURL)
@jsaction.handler(buttons['edit'])
def handleEdit(self, event, selector):
viewURL = absoluteURL(self.context, self.request) + '/@@edit'
- indexForm = getMultiAdapter((self.context, self.request), IBrowserPage,
- name='inline')
- indexForm.update()
- widgetId = indexForm.widgets['title'].id
- func = '$("#%s").html(data)' % widgetId
- return self._handleInlineFormButton(viewURL, func)
+ return self._handleInlineFormButton(viewURL)
Modified: z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/inline.pt
===================================================================
--- z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/inline.pt 2007-08-22 01:26:38 UTC (rev 79109)
+++ z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/inline.pt 2007-08-22 03:55:11 UTC (rev 79110)
@@ -1,10 +1,11 @@
<div tal:replace="structure provider:IJavaScript" />
<div class="node">
- <span tal:replace="structure view/actions/expand/render" />
- <span tal:replace="structure view/actions/contract/render" />
- <span tal:replace="structure view/widgets/title/render" />
-
+ <div class="node-line">
+ <span tal:replace="structure view/actions/expand/render" />
+ <span tal:replace="structure view/actions/contract/render" />
+ <span tal:replace="structure view/widgets/title/render" />
+ </div>
<div tal:attributes="id string:${view/prefix}-inlinecontent"
class="inline-content"></div>
</div>
Modified: z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/tree.css
===================================================================
--- z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/tree.css 2007-08-22 01:26:38 UTC (rev 79109)
+++ z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/tree.css 2007-08-22 03:55:11 UTC (rev 79110)
@@ -2,6 +2,17 @@
display: none;
}
+span.required {
+ color: black;
+}
+
+#tree{
+ float: left;
+ margin-right: 5ex;
+ margin-bottom: 20px;
+ width: 80ex;
+}
+
div.node {
margin-left: 1em;
border-left: 1px dashed black;
@@ -9,13 +20,20 @@
margin-top: 1ex;
}
+div.node-line{
+ background: #eee;
+ border: 1px solid #ccc;
+}
+
div.inline-content{
margin-left: 3ex;
}
form.edit-form {
- border: 1px solid black;
+ border: 1px solid #ccc;
padding: 1ex;
+ background: #eee;
+ margin: 1ex 0px;
}
input.jsbutton-field,
@@ -28,4 +46,24 @@
input.inlineformbutton-field {
color: blue;
+ background: #eee;
+ border: 1px solid #aaa;
+ border-top: 0;
+ margin-right: 1ex;
+}
+
+#server-events{
+ float: left;
+ border: 1px solid #ccc;
+}
+
+#server-events h2{
+ padding: 1ex;
+ background: #eee;
+}
+
+#server-events-container div{
+ padding:1ex;
+ border-top: 1px solid #ccc;
+ background: #fff;
}
\ No newline at end of file
Modified: z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/treenode.pt
===================================================================
--- z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/treenode.pt 2007-08-22 01:26:38 UTC (rev 79109)
+++ z3c.formjsdemo/trunk/src/z3c/formjsdemo/tree/treenode.pt 2007-08-22 03:55:11 UTC (rev 79110)
@@ -2,4 +2,11 @@
<h2>The Root is: <strong tal:content="context/title" /></h2>
<p>And here is the tree:</p>
-<div tal:replace="structure context/@@inline" />
+<div id="tree" tal:content="structure context/@@inline" />
+
+<div id="server-events">
+ <h2>Events that have taken place:</h2>
+ <div id="server-events-container">
+ </div>
+</div>
+
More information about the Checkins
mailing list