1. What is Ctools?
“This suite is primarily a set of APIs and tools to improve the
developer experience”
Controlling the Chaos

2. What is Ctools?
1 Exportables 6 Contexts
2 Ajax Responder 7 Plugins
3 Form Wizard 8 Dependant
4 Modal dialog 9 Content
5 Object Caching 10 Form tools

3. What is Ctools?
“Tools to make it easier for modules to have objects that
live in database or live in code, such as 'default views'.”
01 Exportables

4. What is Ctools?
“Tools to make it easier for the server to handle AJAX
requests and tell the client what to do with them.”
02 AJAX Responder

5. What is Ctools?
“An API to make multi-step forms much easier.”
03 Form Wizard

6. What is Ctools?
“Tool to make it simple to put a form in a modal dialog.”
04 Modal Dialog

7. What is Ctools?
“Tool to make it easier to edit an object across multiple
page requests and cache the editing work.”
05 Object Caching

8. What is Ctools?
“The notion of wrapping objects in a unified wrapper and
providing an API to create and accept these contexts as
input.”
06 Contexts

9. What is Ctools?
“Tools to make it easy for modules to let other modules
implement plugins from .inc files.”
07 Plugins

10. What is Ctools?
“A simple form widget to make form items appear and
disappear based upon the selections in another item.”
08 Dependant

11. What is Ctools?
“Pluggable content types used as panes in Panels and
other modules like Dashboard.”
09 Content

12. What is Ctools?
“Tools to make it easier for forms to deal with AJAX.”
10 Form Tools

13. What is Ctools?
“Tools to make it easier for modules to have objects that
live in database or live in code, such as 'default views'.”
11 Exportables

14. What are Exportables?
A standardized way to define “configuration presets”.
Can be stored in the database or in code
Built in export/import functionality

15. Advantages of Exportables
Portability of configuration settings
Allows configuration to use version control
Allows override/revert functionality
Avoids loading data from database
Allows for Drush and Features integration

16. Using Exportables
Setup your project

17. Implement hook_schema
exportable_demo.install

18. Implement hook_schema exportable_demo.install
Export section is unique to exportables

19. Implement hook_install module.install
Don't forget to call hook_install

20. Define the UI exportable_demo.module
Use Ctools plugins to define the UI

21. Define the UI
/plugin/export_ui/exportable_demo_ctools_export_ui.inc

22. Define the UI
/plugin/export_ui/exportable_demo_ctools_export_ui.inc

23. Default Presets exportable_demo.module
Tell Ctools that we support our default presets

24. Default Presets exportable_demo.module
Define the actual preset

25. 3 Party Module Presets
rd
third_party.module
Tell Ctools that we support our default presets

26. 3 Party Module Presets
rd
third_party.module
Define the actual preset

27. What is Ctools?
“Tools to make it easier for the server to handle AJAX
requests and tell the client what to do with them.”
02 AJAX Responder

28. Advantages Ajax Responder
Ajax without javascript
Part of “core” in Drupal 7
Much simpler than AHAH
Fails gracefully automatically
SEO Compatible

29. Using Ajax Responder ajax_demo.module
Define the AJAX callback

30. Using Ajax Responder ajax_demo.module
Requires two hook_menu items

31. Using Ajax Responder ajax_demo.module
Add a link

32. Ajax Responder Commands
Command functions all take the form:
ctools_ajax_command_[COMMAND_NAME]
Ajax in php

33. Ajax Responder Commands
1 replace 6 remove
2 prepend 7 changed
3 append 8 alert
4 after 9 css
5 before 10 attr

34. Ajax Responder Commands
11 settings 6
12 data
13 redirect
14 reload
15 submit

35. What is Ctools?
“An API to make multi-step forms much easier.”
03 Form Wizard

36. Advantages of Form Wizard
Multistep forms are hard in Drupal
More like FAPI
Allows for better organization of UI
Allows for better organization of code

37. hook_menu callback form_demo.module
Add required wizard and cache includes
Setup multistep array, form settings, callbacks, Labels and IDs
Load form from cache
Render the actual form
This is the hardest part

38. hook_menu callback form_demo.module
 Add wizard and cache includes

39. hook_menu callback
form_demo.module - form_demo_page()
Multistep array: form settings

40. hook_menu callback
form_demo.module - form_demo_page()
Multistep array: form IDs and labels

41. hook_menu callback
form_demo.module - form_demo_page()
Setup form cache

42. hook_menu callback
form_demo.module - form_demo_page()
Render the form

43. Define form step 1 form_demo.module
Just a normal hook_form

44. Define form step 1 form_demo.module
Normal hook_form_validate too!

45. Define form step 1 form_demo.module
Not quite a normal hook_form_submit

46. Define form step 2 form_demo.module
Use choices from step 1 in step 2

47. Define form step 2 form_demo.module
Not quite a normal hook_form_submit

48. Define form step 2 form_demo.module
Even in last submit, dont' save

49. Define form callbacks form_demo.module
Finish Callback – finally we can save

50. Define form callbacks form_demo.module
Next callback – set the cache

51. Define form callbacks form_demo.module
Cancel callback

52. Define form callbacks form_demo.module
Used for passing data between steps

53. What is Ctools?
“Tool to make it simple to put a form in a modal dialog.”
04 Modal Dialog

54. Advantages Modal Dialog
Modal popup without javascript
Standardized way of creating modal
Build to handle forms
Easy to theme

55. Implement hook_menu modal_demo.module
Two menu items, page and modal

56. hook_menu callback modal_demo.module
Add js libraries and create link

57. hook_menu callback modal_demo.module
 Create Modal with any form

58. Modal dialog theming modal_demo.module
Add an array of settings

59. Modal dialog theming modal_demo.module
More modal options

60. Modal dialog theming Ctools-ajax-sample.js
Must be in Drupal.theme.prototype namespace

61. References
Exportables:
 http://drupal.org/node/928026
Ajax Responder:
 http://zroger.com/node/30
Multistep forms:
 http://www.nicklewis.org/using-chaos-tools-form-wizard-
build-multistep-forms-drupal-6
Modal dialog
 http://zroger.com/node/31