Chapter 4: Bling-bling¶
Before we add front-end bling, we need some code that can handle these requests coming in. Let’s create a simple view that will update the object in context to a new state. Go to GitHub and copy the code for WorkflowTransition class in todo.py. This class represents a view that our AJAX code will call. You can also get the code with git, however note that now we are checking out code from master, as Chapter 4 is the last chapter and its code is in the master branch.
$ git checkout master src/tutorial/todoapp/todo.py
Take a look at the WorkflowTransition class and comments around the code. There are a couple of things to point out specific to this setup:
Tells us that this view should be called in the context of a Dexterity Container item. So if you try to go to this view from the portal root or anywhere in the site that is not a Dexterity item, Plone will return a 404 - not found error. By default all Dexterity types that you create TTW are based on the Dexterity Container base class.
This tells us on which URL the view will be available on. In this case, on <url_to_plone_content_object>/update_workflow.
render is a special function that must be used. It is where all of the code must go when used with grok directives. This is the main block of code that will be executed.
transition = self.request.form.get('transition', '')
self.request is set by the base class, and anything based on BrowserView will have access to this variable. All of GET/POST parameters will be stored in self.request.form.
'Content-Type', 'application/json; charset=utf-8')
When working with JSON, it’s not required to set the header content type, but when used with certain jQuery calls it is expected to have the header set correctly. If you don’t set this, it will sometimes work and sometimes not. Get used to setting it!
http://localhost:8080/Plone/todo-list/go-to-the-bathroom + update_workflow?transition = complete
- Write base view and passing test cases
- Test views in browser
- Make ajax interactive
Starting with bling from the start will only bring you pain.
git checkout master src/tutorial/todoapp/static/todoapp.js
git checkout master src/tutorial/todoapp/profiles/default/jsregistry.xml
1 2 3 4 5 6 7 8 9 10 11 12
Trying it out!¶
Holy moley you made it! Restart Zope (to reload Python files), reactivate the product (to reimport XML files), do a hard reload in your web browser (to clear any caches) and check out your todo list. The todo items should toggle between complete and incomplete without the page reloading. Sweet!
ids = [r.getId() for r in resources]
Lastly, add a new test module: test_workflow.py. Download it from GitHub, put and it in your tests folder and run tests. Then fiddle around with it to see what it does. As always, you can use git to get the file.
$ git checkout master src/tutorial/todoapp/tests/test_workflow.py
This concludes the Todo app in Plone tutorial. Congratulations! Now it’s time to checkout other tutorials and documentation available on developer.plone.org!