luca 0.9.8 → 0.9.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (310) hide show
  1. data/CHANGELOG +49 -0
  2. data/Gemfile +8 -1
  3. data/Gemfile.lock +97 -53
  4. data/Guardfile +3 -25
  5. data/README.md +5 -16
  6. data/ROADMAP +15 -9
  7. data/Rakefile +24 -75
  8. data/app.rb +10 -42
  9. data/app/assets/javascripts/luca/basic.coffee +1 -1
  10. data/app/assets/javascripts/luca/components/application.coffee +187 -104
  11. data/app/assets/javascripts/luca/components/collection_view.coffee +115 -51
  12. data/app/assets/javascripts/luca/components/controller.coffee +87 -10
  13. data/app/assets/javascripts/luca/components/fields/base.coffee +74 -13
  14. data/app/assets/javascripts/luca/components/fields/button_field.coffee +60 -13
  15. data/app/assets/javascripts/luca/components/fields/checkbox_array.coffee +12 -7
  16. data/app/assets/javascripts/luca/components/fields/select_field.coffee +82 -23
  17. data/app/assets/javascripts/luca/components/fields/text_area_field.coffee +25 -10
  18. data/app/assets/javascripts/luca/components/fields/text_field.coffee +9 -3
  19. data/app/assets/javascripts/luca/components/form_view.coffee +105 -33
  20. data/app/assets/javascripts/luca/components/grid_layout_view.coffee +42 -0
  21. data/app/assets/javascripts/luca/components/index.coffee +6 -0
  22. data/app/assets/javascripts/luca/components/nav_bar.coffee +60 -6
  23. data/app/assets/javascripts/luca/components/page.coffee +70 -0
  24. data/app/assets/javascripts/luca/components/simple_collection_view.coffee +10 -0
  25. data/app/assets/javascripts/luca/components/table_view.coffee +7 -3
  26. data/app/assets/javascripts/luca/components/table_view_scrollable.coffee +23 -0
  27. data/app/assets/javascripts/luca/concerns/collection_event_bindings.coffee +4 -1
  28. data/app/assets/javascripts/luca/concerns/development_tool_helpers.coffee +23 -14
  29. data/app/assets/javascripts/luca/concerns/dom_helpers.coffee +2 -2
  30. data/app/assets/javascripts/luca/concerns/filterable.coffee +8 -11
  31. data/app/assets/javascripts/luca/concerns/form_model_bindings.coffee +20 -0
  32. data/app/assets/javascripts/luca/concerns/modal_view.coffee +40 -15
  33. data/app/assets/javascripts/luca/concerns/query_collection_bindings.coffee +7 -1
  34. data/app/assets/javascripts/luca/concerns/state_model.coffee +40 -26
  35. data/app/assets/javascripts/luca/concerns/templating.coffee +3 -1
  36. data/app/assets/javascripts/luca/config.coffee +5 -0
  37. data/app/assets/javascripts/luca/containers/card_view.coffee +87 -52
  38. data/app/assets/javascripts/luca/containers/container.coffee +305 -108
  39. data/app/assets/javascripts/luca/containers/modal_view.coffee +9 -9
  40. data/app/assets/javascripts/luca/containers/page_controller.coffee +25 -0
  41. data/app/assets/javascripts/luca/containers/panel_toolbar.coffee +5 -6
  42. data/app/assets/javascripts/luca/containers/tab_view.coffee +19 -10
  43. data/app/assets/javascripts/luca/containers/viewport.coffee +12 -16
  44. data/app/assets/javascripts/luca/core/collection.coffee +19 -5
  45. data/app/assets/javascripts/luca/core/events.coffee +5 -5
  46. data/app/assets/javascripts/luca/core/model.coffee +1 -1
  47. data/app/assets/javascripts/luca/core/panel.coffee +18 -6
  48. data/app/assets/javascripts/luca/core/registry/component_definition.coffee +2 -1
  49. data/app/assets/javascripts/luca/core/registry/meta_data.coffee +2 -0
  50. data/app/assets/javascripts/luca/core/registry/registry.coffee +14 -11
  51. data/app/assets/javascripts/luca/core/templates.coffee +5 -1
  52. data/app/assets/javascripts/luca/core/view.coffee +200 -47
  53. data/app/assets/javascripts/luca/dependencies.coffee +2 -0
  54. data/app/assets/javascripts/luca/development/code_sync_manager.coffee +173 -0
  55. data/app/assets/javascripts/luca/development/component.coffee +76 -0
  56. data/app/assets/javascripts/luca/development/components.coffee +57 -0
  57. data/app/assets/javascripts/luca/development/console.coffee +1 -1
  58. data/app/assets/javascripts/luca/development/index.coffee +4 -1
  59. data/app/assets/javascripts/luca/framework.coffee +7 -3
  60. data/app/assets/javascripts/luca/index.coffee +2 -1
  61. data/app/assets/javascripts/luca/managers/collection_manager.coffee +2 -3
  62. data/app/assets/javascripts/luca/managers/index.coffee +1 -1
  63. data/app/assets/javascripts/luca/managers/socket_manager.coffee +31 -8
  64. data/app/assets/javascripts/luca/templates/components/nav_bar.jst.ejs +16 -1
  65. data/app/assets/javascripts/luca/templates/containers/tab_view.jst.ejs +1 -1
  66. data/app/assets/javascripts/luca/util/index.coffee +1 -0
  67. data/app/assets/javascripts/luca/util/keybindings.coffee +24 -0
  68. data/app/assets/javascripts/luca/util/logging.coffee +15 -0
  69. data/app/assets/javascripts/luca/util/luca.coffee +9 -1
  70. data/app/assets/stylesheets/luca/components/table_view.scss +85 -0
  71. data/app/assets/stylesheets/luca/components/viewport.scss +0 -4
  72. data/app/assets/stylesheets/luca/containers/container.scss +8 -0
  73. data/app/assets/stylesheets/luca/index.css +2 -2
  74. data/bin/luca +14 -0
  75. data/config.ru +1 -2
  76. data/docs/framework.json +1 -0
  77. data/docs/luca-framework-documentation.js +1 -0
  78. data/docs/{application.md → old/application.md} +0 -0
  79. data/docs/{collection.md → old/collection.md} +0 -0
  80. data/docs/{collection_manager.md → old/collection_manager.md} +0 -0
  81. data/docs/{container_philosophy.md → old/container_philosophy.md} +0 -0
  82. data/docs/{event_binding_helpers.md → old/event_binding_helpers.md} +0 -0
  83. data/docs/{method_caching_and_computed_properties.md → old/method_caching_and_computed_properties.md} +0 -0
  84. data/docs/{view.md → old/view.md} +0 -0
  85. data/lib/generators/luca/application/templates/javascripts/dependencies.coffee +2 -5
  86. data/lib/guard/luca.rb +84 -0
  87. data/lib/luca.rb +25 -1
  88. data/lib/luca/asset_compiler.rb +117 -0
  89. data/lib/luca/cli.rb +68 -0
  90. data/lib/luca/cli/generate.rb +37 -0
  91. data/lib/luca/cli/server.rb +20 -0
  92. data/lib/luca/cli/sync.rb +40 -0
  93. data/lib/luca/cli/watch.rb +16 -0
  94. data/lib/luca/collection.rb +64 -0
  95. data/lib/luca/collection/endpoint.rb +38 -0
  96. data/lib/luca/collection/file_backend.rb +121 -0
  97. data/lib/luca/collection/redis_backend.rb +153 -0
  98. data/lib/luca/compiled_asset.rb +61 -0
  99. data/lib/luca/component_definition.rb +356 -0
  100. data/lib/luca/luca_application.rb +258 -0
  101. data/lib/luca/project.rb +73 -0
  102. data/lib/luca/project_harness.rb +96 -0
  103. data/lib/luca/rails.rb +5 -3
  104. data/lib/luca/rails/engine.rb +8 -0
  105. data/lib/luca/rails/version.rb +1 -2
  106. data/lib/luca/server.rb +7 -0
  107. data/lib/luca/stylesheet.rb +35 -0
  108. data/lib/luca/template.rb +2 -0
  109. data/lib/luca/template_asset.rb +64 -0
  110. data/lib/luca/version.rb +3 -0
  111. data/lib/luca/watcher.rb +72 -0
  112. data/lib/railties/luca/tasks.rake +7 -0
  113. data/site/.bundle/config +2 -0
  114. data/site/.gitignore +5 -0
  115. data/site/.rvmrc +1 -0
  116. data/site/CHANGELOG.md +41 -0
  117. data/site/DOCS.md +41 -0
  118. data/site/Gemfile +8 -0
  119. data/site/Gemfile.lock +134 -0
  120. data/site/LICENSE.md +19 -0
  121. data/site/config.rb +84 -0
  122. data/site/helpers/site_helpers.rb +20 -0
  123. data/site/html5bp-docs/README.md +38 -0
  124. data/site/html5bp-docs/contribute.md +104 -0
  125. data/site/html5bp-docs/crossdomain.md +21 -0
  126. data/site/html5bp-docs/css.md +135 -0
  127. data/site/html5bp-docs/extend.md +507 -0
  128. data/site/html5bp-docs/faq.md +77 -0
  129. data/site/html5bp-docs/htaccess.md +323 -0
  130. data/site/html5bp-docs/html.md +170 -0
  131. data/site/html5bp-docs/js.md +31 -0
  132. data/site/html5bp-docs/misc.md +25 -0
  133. data/site/html5bp-docs/usage.md +109 -0
  134. data/site/readme.md +47 -0
  135. data/site/source/.htaccess +540 -0
  136. data/site/source/404.html +157 -0
  137. data/site/source/app/assets/javascripts/dependencies.js.coffee +6 -0
  138. data/site/source/app/assets/javascripts/docs-docs.js +1 -0
  139. data/site/source/app/assets/javascripts/docs/application.coffee +64 -0
  140. data/site/source/app/assets/javascripts/docs/collections/docs_documentation.coffee +17 -0
  141. data/site/source/app/assets/javascripts/docs/collections/github_repositories.coffee +7 -0
  142. data/site/source/app/assets/javascripts/docs/collections/index.coffee +1 -0
  143. data/site/source/app/assets/javascripts/docs/collections/luca_documentation.coffee +17 -0
  144. data/site/source/app/assets/javascripts/docs/collections/public_gists.coffee +4 -0
  145. data/site/source/app/assets/javascripts/docs/config.coffee +5 -0
  146. data/site/source/app/assets/javascripts/docs/index.coffee +12 -0
  147. data/site/source/app/assets/javascripts/docs/lib/router.coffee +3 -0
  148. data/{spec/components/application_spec.coffee → site/source/app/assets/javascripts/docs/lib/util.coffee} +0 -0
  149. data/site/source/app/assets/javascripts/docs/models/component.coffee +99 -0
  150. data/site/source/app/assets/javascripts/docs/models/github_repository.coffee +3 -0
  151. data/site/source/app/assets/javascripts/docs/models/index.coffee +1 -0
  152. data/site/source/app/assets/javascripts/docs/templates/component_documentation.jst.ejs +55 -0
  153. data/site/source/app/assets/javascripts/docs/templates/examples_browser/overview.jst.ejs +4 -0
  154. data/site/source/app/assets/javascripts/docs/templates/examples_browser/selector.jst.ejs +11 -0
  155. data/site/source/app/assets/javascripts/docs/templates/github_repository.jst.ejs +4 -0
  156. data/site/source/app/assets/javascripts/docs/templates/layouts/main.jst.ejs +4 -0
  157. data/site/source/app/assets/javascripts/docs/templates/left_navigation.jst.ejs +5 -0
  158. data/site/source/app/assets/javascripts/docs/templates/pages/getting_started.jst.ejs +78 -0
  159. data/site/source/app/assets/javascripts/docs/templates/pages/home.jst.ejs +57 -0
  160. data/site/source/app/assets/javascripts/docs/views/components/code_editor.coffee +45 -0
  161. data/{spec/components/collection_loader_view_spec.coffee → site/source/app/assets/javascripts/docs/views/components/code_editor/index.coffee} +0 -0
  162. data/site/source/app/assets/javascripts/docs/views/components/component_documentation.coffee +72 -0
  163. data/site/source/app/assets/javascripts/docs/views/index.coffee +3 -0
  164. data/site/source/app/assets/javascripts/docs/views/pages/browse_source.coffee +46 -0
  165. data/site/source/app/assets/javascripts/docs/views/pages/browse_source/details.coffee +37 -0
  166. data/site/source/app/assets/javascripts/docs/views/pages/browse_source/list.coffee +31 -0
  167. data/site/source/app/assets/javascripts/docs/views/pages/component_editor.coffee +10 -0
  168. data/site/source/app/assets/javascripts/docs/views/pages/examples_browser.coffee +102 -0
  169. data/site/source/app/assets/javascripts/docs/views/pages/examples_browser/docs.coffee +12 -0
  170. data/site/source/app/assets/javascripts/docs/views/pages/examples_browser/source.coffee +13 -0
  171. data/site/source/app/assets/javascripts/docs/views/pages/home.coffee +10 -0
  172. data/site/source/app/assets/javascripts/docs/views/views/api_browser/index.coffee +43 -0
  173. data/site/source/app/assets/javascripts/docs/views/views/collection_view_examples/grid_layout_view_example.coffee +14 -0
  174. data/site/source/app/assets/javascripts/docs/views/views/collection_view_examples/table_view_example.coffee +39 -0
  175. data/site/source/app/assets/javascripts/docs/views/views/form_view_examples/basic_example.coffee +38 -0
  176. data/site/source/app/assets/javascripts/docs/views/views/form_view_examples/complex_layout.coffee +110 -0
  177. data/site/source/app/assets/javascripts/docs/views/views/top_navigation.coffee +6 -0
  178. data/site/source/app/assets/javascripts/luca-docs.js +1 -0
  179. data/site/source/app/assets/javascripts/luca-framework-documentation.js +1 -0
  180. data/site/source/app/assets/javascripts/site.js.coffee +4 -0
  181. data/site/source/app/assets/javascripts/vendor/codemirror.js +4786 -0
  182. data/site/source/app/assets/javascripts/vendor/coffeescript.js +346 -0
  183. data/site/source/app/assets/javascripts/vendor/css.js +465 -0
  184. data/site/source/app/assets/javascripts/vendor/htmlmixed.js +84 -0
  185. data/site/source/app/assets/javascripts/vendor/javascript.js +422 -0
  186. data/site/source/app/assets/javascripts/vendor/js-beautify.js +1353 -0
  187. data/site/source/app/assets/javascripts/vendor/modernizr-2.6.1.min.js +4 -0
  188. data/site/source/app/assets/javascripts/vendor/vim.js +2511 -0
  189. data/site/source/app/assets/stylesheets/docs/api-browser.css.scss +5 -0
  190. data/site/source/app/assets/stylesheets/docs/application.css.scss +35 -0
  191. data/site/source/app/assets/stylesheets/docs/browse-source.css.scss +5 -0
  192. data/site/source/app/assets/stylesheets/docs/scrollable-table.css.scss +5 -0
  193. data/site/source/app/assets/stylesheets/site.css.scss +2 -0
  194. data/site/source/app/assets/stylesheets/vendor/codemirror.css +240 -0
  195. data/site/source/app/assets/stylesheets/vendor/prettify-tomorrow-night-bright.css +160 -0
  196. data/site/source/app/assets/stylesheets/vendor/twilight.css +26 -0
  197. data/site/source/crossdomain.xml +15 -0
  198. data/site/source/documentation.html.haml +1 -0
  199. data/site/source/favicon_base.png +0 -0
  200. data/site/source/humans.txt +15 -0
  201. data/site/source/images/background.png +0 -0
  202. data/site/source/images/middleman.png +0 -0
  203. data/site/source/index.html.haml +1 -0
  204. data/site/source/layouts/layout.haml +55 -0
  205. data/site/source/readme.md +63 -0
  206. data/site/source/robots.txt +3 -0
  207. data/spec/{components/grid_view_spec.coffee → javascripts/components/application_spec.coffee} +0 -0
  208. data/spec/{components/pagination_control_spec.coffee → javascripts/components/collection_loader_view_spec.coffee} +0 -0
  209. data/spec/{components → javascripts/components}/collection_view_spec.coffee +1 -1
  210. data/spec/{components → javascripts/components}/controller_spec.coffee +0 -0
  211. data/spec/{components → javascripts/components}/fields/checkbox_array_spec.coffee +0 -0
  212. data/spec/javascripts/components/form_view_spec.coffee +162 -0
  213. data/spec/{components/record_manager_spec.coffee → javascripts/components/grid_view_spec.coffee} +0 -0
  214. data/spec/{components → javascripts/components}/multi_collection_view_spec.coffee +0 -0
  215. data/spec/{components/template_spec.coffee → javascripts/components/pagination_control_spec.coffee} +0 -0
  216. data/spec/{concerns/paginatable_spec.coffee → javascripts/components/record_manager_spec.coffee} +0 -0
  217. data/spec/{components → javascripts/components}/table_view_spec.coffee +0 -0
  218. data/spec/{containers/modal_view_spec.coffee → javascripts/components/template_spec.coffee} +0 -0
  219. data/spec/{concerns → javascripts/concerns}/collection_event_bindings_spec.coffee +0 -0
  220. data/spec/{concerns → javascripts/concerns}/dom_helpers_spec.coffee +0 -0
  221. data/spec/{concerns → javascripts/concerns}/filterable_spec.coffee +0 -0
  222. data/spec/{concerns → javascripts/concerns}/model_presenter_spec.coffee +0 -0
  223. data/spec/{containers/panel_view_spec.coffee → javascripts/concerns/paginatable_spec.coffee} +0 -0
  224. data/spec/{concerns → javascripts/concerns}/state_model_spec.coffee +5 -0
  225. data/spec/javascripts/containers/card_view_spec.coffee +108 -0
  226. data/spec/{containers/tab_view_spec.coffee → javascripts/containers/modal_view_spec.coffee} +0 -0
  227. data/spec/{containers/viewport_spec.coffee → javascripts/containers/panel_view_spec.coffee} +0 -0
  228. data/spec/{core/observer_spec.coffee → javascripts/containers/tab_view_spec.coffee} +0 -0
  229. data/spec/{managers/socket_manager_spec.coffee → javascripts/containers/viewport_spec.coffee} +0 -0
  230. data/spec/{core → javascripts/core}/collection_spec.coffee +1 -1
  231. data/spec/{core → javascripts/core}/concerns_spec.coffee +0 -0
  232. data/spec/{core → javascripts/core}/container_spec.coffee +0 -0
  233. data/spec/{core → javascripts/core}/define_spec.coffee +0 -0
  234. data/spec/{core → javascripts/core}/events_spec.coffee +0 -0
  235. data/spec/{core → javascripts/core}/field_spec.coffee +0 -0
  236. data/spec/{core → javascripts/core}/framework_spec.coffee +0 -0
  237. data/spec/{core → javascripts/core}/model_spec.coffee +0 -0
  238. data/spec/javascripts/core/observer_spec.coffee +0 -0
  239. data/spec/{core → javascripts/core}/util_spec.coffee +0 -0
  240. data/spec/{core → javascripts/core}/view_spec.coffee +51 -39
  241. data/spec/{dependencies → javascripts/dependencies}/index.coffee +0 -0
  242. data/spec/{dependencies → javascripts/dependencies}/jasmine-html.js +0 -0
  243. data/spec/{dependencies → javascripts/dependencies}/jasmine.js +0 -0
  244. data/spec/{dependencies → javascripts/dependencies}/sinon.js +0 -0
  245. data/spec/{helper.coffee → javascripts/helper.coffee} +0 -0
  246. data/spec/{managers → javascripts/managers}/collection_manager_spec.coffee +0 -0
  247. data/spec/javascripts/managers/socket_manager_spec.coffee +0 -0
  248. data/spec/lib/component_definition_spec.rb +63 -0
  249. data/spec/lib/input_compiler_spec.rb +9 -0
  250. data/spec/lib/luca_application_spec.rb +30 -0
  251. data/spec/support/fixtures/application.coffee +45 -0
  252. data/spec/support/fixtures/component.coffee +34 -0
  253. data/tutorials/component-definitions.md +0 -0
  254. data/tutorials/component-definitions/01_intro.md +0 -0
  255. data/tutorials/component-driven-design.md +140 -0
  256. data/tutorials/structure-of-a-project.md +63 -0
  257. data/vendor/assets/javascripts/backbone-min.js +37 -33
  258. data/vendor/assets/javascripts/backbone-query.min.js +1 -1
  259. data/vendor/assets/javascripts/hogan.js +707 -0
  260. data/vendor/assets/javascripts/jquery.js +5 -4
  261. data/vendor/assets/javascripts/keymaster.min.js +4 -0
  262. data/vendor/assets/javascripts/luca-dependencies.min.js +8 -0
  263. data/vendor/assets/javascripts/luca-development.min.js +1 -0
  264. data/vendor/assets/javascripts/luca-spec.js +6 -6
  265. data/vendor/assets/javascripts/luca-ui.js +7386 -0
  266. data/vendor/assets/javascripts/luca-ui.min.js +5 -0
  267. data/vendor/assets/javascripts/luca.full.min.js +12 -0
  268. data/vendor/assets/javascripts/luca.min.js +5 -0
  269. data/vendor/assets/javascripts/underscore-min.js +1 -5
  270. data/vendor/assets/javascripts/underscore-string.min.js +1 -1
  271. data/vendor/assets/stylesheets/luca-components.css +202 -0
  272. data/vendor/assets/stylesheets/luca-development.css +23 -0
  273. data/vendor/assets/stylesheets/luca-ui.css +198 -0
  274. metadata +324 -94
  275. data/app/assets/javascripts/luca/components/base_toolbar.coffee +0 -17
  276. data/app/assets/javascripts/luca/components/form_button_toolbar.coffee +0 -28
  277. data/app/assets/javascripts/luca/components/grid_view.coffee +0 -269
  278. data/app/assets/javascripts/luca/components/page_controller.coffee +0 -7
  279. data/app/assets/javascripts/luca/components/template.coffee +0 -5
  280. data/app/assets/javascripts/luca/components/toolbar_dialog.coffee +0 -25
  281. data/lib/luca/code_browser.rb +0 -55
  282. data/lib/luca/command_line.rb +0 -69
  283. data/lib/luca/component_documentation.rb +0 -72
  284. data/site/assets/bootstrap.min.js +0 -7
  285. data/site/assets/dependencies.js +0 -94
  286. data/site/assets/glyphicons-halflings-white.png +0 -0
  287. data/site/assets/glyphicons-halflings.png +0 -0
  288. data/site/assets/luca-ui-bootstrap.css +0 -1331
  289. data/site/assets/luca-ui-bootstrap.js +0 -9
  290. data/site/assets/luca-ui-development-tools.css +0 -234
  291. data/site/assets/luca-ui-development-tools.js +0 -18561
  292. data/site/assets/luca-ui-development-tools.min.js +0 -15
  293. data/site/assets/luca-ui-full.min.js +0 -8
  294. data/site/assets/luca-ui.min.js +0 -4
  295. data/site/assets/sandbox.css +0 -62
  296. data/site/assets/sandbox.js +0 -469
  297. data/site/docs/application.html +0 -41
  298. data/site/docs/caching.html +0 -43
  299. data/site/docs/collection.html +0 -75
  300. data/site/docs/collection_manager.html +0 -71
  301. data/site/docs/containers.html +0 -118
  302. data/site/docs/events.html +0 -153
  303. data/site/docs/view.html +0 -128
  304. data/site/img/glyphicons-halflings-white.png +0 -0
  305. data/site/img/glyphicons-halflings.png +0 -0
  306. data/site/index.html +0 -20
  307. data/site/source-map.js +0 -1
  308. data/spec/components/form_view_spec.coffee +0 -84
  309. data/spec/containers/card_view_spec.coffee +0 -50
  310. data/spec/luca-spec.coffee +0 -9
@@ -1,41 +0,0 @@
1
- <h1>Luca.Application</h1>
2
- <p>A large single-page app generally needs some sort of globally available state tracking object, as well as something which acts as a single entry point into the application, and some sort of gateway to important objects.
3
-
4
- </p>
5
- <p>Luca.Application is a type of Viewport class which handles things such as:
6
-
7
- </p>
8
- <ul>
9
- <li>collection manager ( manages your collections for you ) </li>
10
- <li>socket manager ( relays websocket events as Backbone.Events )</li>
11
- <li>url fragment router (<code>Backbone.Router</code>)</li>
12
- <li>global attributes and change event bindings</li>
13
- <li>page controller ( displays a unique page of the application) </li>
14
- <li>active view, active sub view helpers</li>
15
- </ul>
16
- <p>The Luca.Application stores its state in a <code>Backbone.Model</code>, which means you can <code>get()</code> and <code>set()</code> attributes directly on the application, as well as bind to change events on the application itself, and expect the same API you would from a normal model.
17
-
18
- </p>
19
- <p>The ability to treat the Luca.Application instance as both a view, and a model allows for some clean patterns. Your views can declaratively list its dependency on the global application state attributes.
20
-
21
- </p>
22
- <pre><code class="lang-coffeescript"> _.def("MyView").extends("Luca.View").with
23
- name: "my_view"
24
-
25
- applicationEvents:
26
- "change:status" : "onStatusChange"
27
-
28
- onStatusChange: (app, currentStatus)-&gt;
29
- if currentStatus is "inactive"
30
- @markInactive()
31
-
32
- markInactive: ()-&gt;
33
- # mark this view inactive if the application
34
- # goes into inactive status
35
-
36
-
37
- app = Luca.getApplication()
38
-
39
- # this will cause the view named 'my_view' to
40
- # to fire its markInactive() method
41
- app.set("status", "inactive")</code></pre>
@@ -1,43 +0,0 @@
1
- <h1>Method Caching and Computed Properties on Luca Collection and Model</h1>
2
- <p>The concept of computed properties ( on the model ) or cached methods ( on the collection )
3
- optimizes for cases where you call a method that performs calculations or some other operations
4
- whose value is dependent on the model and its underlying attributes.
5
-
6
- </p>
7
- <h2>Cached Methods on Luca.Collection</h2>
8
- <p>Luca provides a configuration API for Luca.Collection where you specify the method whose value
9
- you wish to cache, and the change events which get bubbled up from the models that would change
10
- the value, in essence expiring the cache. In addition to change events, standard events on the
11
- collection for when a model is added or removed will expire the cached value.
12
-
13
- </p>
14
- <pre><code class="lang-coffeescript"> _.def("MyCollection").extends("Luca.Collection").with
15
- name:"my_collection"
16
-
17
- cachedMethods:[
18
- "expensiveMethod:attributeOne,attributeTwo",
19
- "anotherExpensiveMethod"
20
- ]
21
-
22
- expensiveMethod: ()-&gt;
23
- @map (model)-&gt; model.get('attributeOne') + model.getAttribute('two')
24
-
25
- anotherExpensiveMethod: ()-&gt;
26
- @map (model)-&gt; model.value()</code></pre>
27
- <p>In the example above, the expensiveMethod is dependent on the attributeOne and attributeTwo attributes
28
- on each of the models in the collection, therefor if any of these values change, the cache needs to be expired.
29
-
30
- </p>
31
- <p>the anotherExpensiveMethod call is not dependent on any specific values, so will only expire any time a new model
32
- is added or removed, or the collection is reset.
33
-
34
- </p>
35
- <h2>Computed Properties on Luca.Model</h2>
36
- <pre><code class="lang-coffeescript"> _.def("MyModel").extends("Luca.Model").with
37
- computed:
38
- "expensiveMethod" : ["dependencyOne","dependencyTwo"]
39
-
40
- expensiveMethod: ()-&gt;
41
- @get("dependencyOne") + @get("dependencyTwo")</code></pre>
42
- <p>In the example above, once expensiveMethod is called, its value will be cached and will be invalidated
43
- any time the dependencyOne or dependencyTwo attribute changes and triggers a change:dependencyTwo event.</p>
@@ -1,75 +0,0 @@
1
- <h1>Luca.Collection</h1>
2
- <p>The <code>Luca.Collection</code> class is the base class for Luca components. A number of patterns and optimizations that are helpful in your collection classes have been extracted into the base class.
3
-
4
- </p>
5
- <h2>Backbone Query Integration</h2>
6
- <p>Luca.Collection either extends from <code>Backbone.Collection</code>, or if it is available <code>Backbone.QueryCollection</code>. The Query Collection was developed by <a href="https://github.com/davidgtonge">Dave Tonge</a> and the project can be found on <a href="https://github.com/datapimp/backbone_query">Github</a>.
7
-
8
- </p>
9
- <p><code>Luca.Collections</code> which extend from <code>Backbone.QueryCollection</code> will have a query method which provides you with an API for filtering your collection's models with an API similar to <a href="http://www.mongodb.org/display/DOCS/Advanced+Queries">MongoDB</a>
10
-
11
- </p>
12
- <h2>Bootstrapping your models on page load for performance</h2>
13
- <p>A good habit for any single page application is to not populate all of your collections via remote calls to your RESTful API. In a lot of cases it is better to put the data that needs to end up in your collections into the initial page load.
14
-
15
- </p>
16
- <p>Luca.Collection classes optimize for this pattern through the bootstrap functionality that is baked into the component.
17
-
18
- </p>
19
- <p>The bootstrap configuration for <code>Luca.Collection</code> classes depends on the collection being defined with a <code>@cache_key</code> property. <code>@cache_key</code> is either a function which returns a string, or a string, for simple cases.
20
-
21
- </p>
22
- <p>To make an array of objects available as models for a collection, either store the objects in <code>Luca.Collection._bootstrapped_models</code> on a property matching the value of <code>@cache_key</code> or use the <code>Luca.Collection.cache()</code> method like such:
23
-
24
- </p>
25
- <pre><code class="lang-html"> &lt;body&gt;
26
- &lt;script type="text/javascript"&gt;
27
- Luca.Collection.cache("books",[{author:"Jonathan Soeder"}]
28
- &lt;/script&gt;</code></pre>
29
- <p>This will work with the following collection:
30
-
31
- </p>
32
- <pre><code class="lang-coffeescript"> _.def("BooksCollection").extends("Luca.Collection").with
33
- name:"books"
34
- cache_key: "books"</code></pre>
35
- <p>Any calls to <code>(new BooksCollection()).fetch()</code> will look in the cached models first, and avoid an API call.
36
-
37
- </p>
38
- <p>If you want to refresh the BooksCollection from your API, just pass in an options hash like such:
39
-
40
- </p>
41
- <pre><code class="lang-coffeescript"> booksCollection.fetch(refresh:true)</code></pre>
42
- <h2>Base Params for RESTful API</h2>
43
- <p>There are a lot of cases where you need every API call to pass along the same parameters ( authentication_tokens, keys, etc )
44
-
45
- </p>
46
- <p><code>Luca.Collection</code> will wrap the <code>@url</code> property or method with a function which appends the base parameters as an HTTP Query Parameter string.
47
-
48
- </p>
49
- <pre><code class="lang-coffeescript"> _.def("BooksCollection").extends("Luca.Collection").with
50
- name: "books"
51
- url: "/api/v1/books"
52
-
53
- app = Luca.getApplication()
54
-
55
- app.on "authenticated", ()-&gt;
56
- Luca.Collection.baseParams =
57
- auth_token: app.get("authentication_token")
58
-
59
- app.collection("books").url() # =&gt; "/api/v1/books?auth_token=123456"</code></pre>
60
- <h2>onceLoaded and ifLoaded helpers</h2>
61
- <p>There are cases where you want to do something on a collection if it has data, but if it doesn't, you need to fetch that data, and bind a callback to the reset event. This can get tedious.
62
-
63
- </p>
64
- <p>Passing a callback to <code>collection.ifLoaded(callback)</code> will eliminate the boilerplate in this pattern.
65
-
66
- </p>
67
- <p>If you only want the callback to run once, use <code>collection.onceLoaded()</code>.
68
-
69
- </p>
70
- <p>In either of these methods, if you don't watch to automatically call <code>@fetch()</code> on the collection, pass an autoFetch option set to false
71
-
72
- </p>
73
- <pre><code> app.collection("books").ifLoaded ()-&gt;
74
- @doSomething()
75
- , autoFetch: false</code></pre>
@@ -1,71 +0,0 @@
1
- <h1>The Luca Collection Manager</h1>
2
- <p>The CollectionManager is a single instance which acts as a gateway to
3
- the instances of Luca.Collection created in your app. The intention is
4
- to provide a central place for creating one, and only one instance of a
5
- given collection type.
6
-
7
- </p>
8
- <p>You can use CollectionManager independently, or you will get one by default
9
- when you use a Luca.Application with the default configuration.
10
-
11
- </p>
12
- <p>A CollectionManager has a name property which is 'primary' by default. If
13
- you call <code>Luca.CollectionManager.get()</code> it will return the CollectionManager
14
- named 'primary' or the first one ever created. Attempting to create an additional
15
- CollectionManager instance with a name that is already used, will throw an error.
16
-
17
- </p>
18
- <h2>Named Collections and Auto-Registering</h2>
19
- <p>You can configure your Luca.Collection classes to have their instances automatically
20
- register with the collection manager. By specifying a <code>@name</code> property on your collection prototypes, they will automatically attempt to register with the running collection manager instance ( via <code>Luca.CollectionManager.get()</code> ) as soon as they are initialized.
21
-
22
- </p>
23
- <p>You can specify which manager you want a collection to register with by specifying a <code>@manager</code> property on your collection. This can either be a string, which will get resolved when needed to a variable, or a direct reference to the collection manager. The string is useful since, when declaring your Luca.Collection prototypes, the collection manager will most likely not be instantiated.
24
-
25
- </p>
26
- <pre><code class="lang-coffeescript"> _.def("MyCollection").extends("Luca.Collection").with
27
- name: "my_collection"
28
- manager: "AppInstance.collectionManager"</code></pre>
29
- <h2>Private Collections</h2>
30
- <p>You may not always want to use the global, single authoritative instance of a collection. In this case, you can specify a <code>@private</code> or <code>@anonymous</code> property on your collection, and it will skip registering with the collection manager.
31
-
32
- </p>
33
- <h2>Collection Class Naming</h2>
34
- <p>Your custom Luca.Collection classes get named like MyApp.collections.SampleCollection. Through some string magic "SampleCollection" will get turned into "sample_collection". If you try to call collectionManager.getOrCreate("sample_collection") it will attempt to get a collection named "sample_collection", and if it fails, will create a new instance of MyApp.collections.SampleCollection. If you want to force your CollectionManager to look in a specific namespace, set a reference to MyApp.collections on Luca.Collection.namespace, otherwise it will look in all of the namespaces it knows about in the Luca.registry and find an appropriate collection.
35
-
36
- </p>
37
- <h2>Initial Collections</h2>
38
- <p>The CollectionManager can be configured with an @initialCollections property, which is an array of names of collection classes, similar to "sample_collection", or actual references to Collection Classes, or strings with their names. The CollectionManager will create instances of the collection for you, and call fetch() on all of them.
39
-
40
- </p>
41
- <pre><code class="lang-coffeescript"> _.def("App.collections.SampleCollection").extends("Luca.Collection").with
42
- name: "sample_collection"
43
-
44
- _.def("App.collections.ExampleCollection").extends("Luca.Collection").with
45
- name: "example_collection"
46
-
47
- class App.CollectionManager extends Luca.CollectionManager
48
- initialCollections:[
49
- "sample_collection"
50
- "example_collection"
51
- ]
52
-
53
- # this will create instances of both of the above collections
54
- # and call fetch() on all of them
55
- collectionManager = new App.CollectionManager()</code></pre>
56
- <h2>Event Relaying</h2>
57
- <p>By default <code>@relayEvents</code> is set to true on the CollectionManager. This means that
58
- any event that is triggered by a collection that is managed by the collection manager will be bubbled up to the manager. This feature is used by the collectionEvents configuration API used by Luca.View, but can also be used in custom situations as well. Simply bind to the CollectionManager instance.
59
-
60
- </p>
61
- <p>Event triggers will look like <code>collection_name event</code>:
62
-
63
-
64
- </p>
65
- <pre><code class="lang-coffeescript"> collection = new App.collections.SampleCollection([],name:"sample_collection")
66
- manager = new Luca.CollectionManager(collectionNamespace:App.collections)
67
-
68
- manager.on "sample_collection reset", ()=&gt; @doSomething()
69
-
70
- # will trigger 'reset' and call doSomething()
71
- collection.fetch()</code></pre>
@@ -1,118 +0,0 @@
1
- <h1>Container Views in Luca.js</h1>
2
- <p>Containers are types of views which are made up of one or more components. A component
3
- is simply another Backbone.View, Luca.View, or one of their descendants.
4
-
5
- </p>
6
- <p>The purpose of a Container is to faciliate the communication between the components.
7
-
8
- </p>
9
- <p>The classic example is a FormView. A FormView is a component which inherits from
10
- Luca.core.Container and is made up of many Field components, and facilitates the communication between
11
- the fields and a Backbone.Model. The internal implementation of the model and field classes should never know
12
- or reference any other component. This is the job of the FormView.
13
-
14
- </p>
15
- <h2>Containers are meant to generate your structural DOM elements</h2>
16
- <p>Containers generate the structural DOM elements which wrap the individual components, and the container renders these components to the DOM element
17
- that is assigned to it. The various types of containers you use will each
18
- have their own internal logic for the way these DOM elements are laid out, displayed, hidden, showed, etc.
19
-
20
- </p>
21
- <p>For example, a ColumnView will show two components side by side and assign
22
- each one to its own DIV element and use css to lay those columns out as configured.
23
- A CardView will assign each component to a DIV element, show the active card, and hide the rest.
24
-
25
- </p>
26
- <h2>Layout and Rendering Customization</h2>
27
- <p>The call to <code>render()</code> on a container will start a rendering chain on all of the nested components. You can customize this to your hearts content by tapping into
28
- the method chain.
29
-
30
- </p>
31
- <p>All render() methods on Luca.View are wrapped and will trigger <code>before:render</code> and <code>after:render</code> events, as well as call any beforeRender or afterRender methods defined on your component. For more about this, see the section about hooks on Luca.View.
32
-
33
- </p>
34
- <p>The chain started by a call to <code>container.render()</code> is as follows:
35
-
36
- </p>
37
- <pre><code class="lang-coffeescript"> beforeRender()
38
-
39
- # layout functions
40
- @trigger "before:layout" # =&gt; or run beforeLayout() if it exists
41
- @prepareLayout()
42
- @trigger "after:layout" # =&gt; or run afterLayout() if it exists</code></pre>
43
- <p>prepareLayout is an internal method on Luca.core.Container which will iterate
44
- over each of your components and call applyDOMconfig passing your components
45
- configuration to this function. This will create a DOM element and apply
46
- any configured inline style declarations, assign a DOM id, css class, as well
47
- as some data attributes to the element.
48
-
49
- </p>
50
- <p>It will put each DOM container elemement in a @componentContainers property on
51
- your container object.
52
-
53
- </p>
54
- <p>After prepareLayout is the components cycle:
55
-
56
- </p>
57
- <pre><code class="lang-coffeescript"> @trigger "before:components" # =&gt; or run beforeComponents() if it exists
58
- @prepareComponents()
59
- @createComponents()
60
- @trigger "before:render:components"
61
- @renderComponents()
62
- @trigger "after:components" # =&gt; or run afterComponents() if it exists</code></pre>
63
- <h2>A Note on Container inheritance</h2>
64
- <p>If you end up customizing the methods above in the render chain, you may
65
- want to call the same method on the component you are inheriting from. Luca
66
- provides some syntactic sugar for this:
67
-
68
- </p>
69
- <pre><code class="lang-coffeescript"> _.def("MyContainer").extends("Luca.core.Container").with
70
- prepareLayout: ()-&gt;
71
- # This is the normal way you would do this
72
- Luca.core.Container::prepareLayout.apply(@, arguments)
73
-
74
- # This is the sugary version which you get if you
75
- # use the _.def or Luca.define method for declaring
76
- # your prototype definitions
77
- @_super("prepareLayout", @, arguments)
78
-
79
- @applyMyOwnLayoutCustomizations()</code></pre>
80
- <h2>The <code>ctype</code> property</h2>
81
- <p>Every Luca.View which gets registered through the Luca.registry will have a ctype value associated with it. The
82
- ctype property is used when adding components to a Container.
83
-
84
- </p>
85
- <pre><code class="lang-coffeescript"> _.def("ComponentOne").extends("Luca.View").with()
86
-
87
- _.def("ComponentTwo").extends("Luca.View").with()
88
-
89
- _.def("ContainerOne").extends("Luca.core.Container").with
90
- components:[
91
- ctype: "component_one"
92
- overriddenValue: "customValue"
93
- ,
94
- ctype: "component_two"
95
- thisGetsPassedToInitialize: "yep"
96
- ]</code></pre>
97
- <p>In the above example, a View class of ContainerOne will be available, and
98
- any time you create an instance of it and call render on it, it will create
99
- instances of ComponentOne and ComponentTwo.
100
-
101
- </p>
102
- <p>Note, if you do not need to customize any of the properties on the component
103
- views, you can just pass an array of ctype strings.
104
-
105
- </p>
106
- <pre><code class="lang-coffeescript"> _.def("ContainerTwo").extends("Luca.core.Container").with
107
- components:["component_one","component_two"]</code></pre>
108
- <h2>Convenience Methods on the Container</h2>
109
- <p>You have access to several methods which work on the components which belong to your views. These methods are:
110
-
111
- </p>
112
- <ul>
113
- <li>pluck : plucks an attribute for each component</li>
114
- <li>invoke: invokes a method for each component</li>
115
- <li>each: run the passed iterator on eachComponent, recursively. You can turn off the recursion by passing false as your second argument.</li>
116
- <li>indexOf: get the index of a component by it's name property</li>
117
- <li>selectByAttribute: selects all components whose attribute matches a given value</li>
118
- </ul>
@@ -1,153 +0,0 @@
1
-
2
- <h2>Event Binding Syntactic Sugar</h2>
3
- <p><code>Luca.Events</code> provides you with some additional event binding sugar.
4
-
5
- </p>
6
- <p><strong>once</strong>
7
-
8
- </p>
9
- <p><code>once</code> is how you would run one function in response to an event, but only once.
10
-
11
- </p>
12
- <pre><code class="lang-coffeescript"> view = new Luca.View()
13
-
14
- view.once "event:gets:triggered", ()-&gt;
15
- alert('sup baby')
16
-
17
- view.trigger("event:gets:triggered")</code></pre>
18
- <p><strong>defer until</strong>
19
-
20
- </p>
21
- <p><code>defer</code> is similar to `once', but with syntax I like a little better:
22
-
23
- </p>
24
- <pre><code class="lang-coffeescript"> _.def("MyView").extends("Luca.View").with
25
- initialize: ()-&gt;
26
- @defer(@setup).until("event:gets:triggered")</code></pre>
27
- <p>If you want to defer a callback until an event gets triggered on some other object:
28
-
29
- </p>
30
- <pre><code class="lang-coffeescript">
31
- _.def("MyView").extends("Luca.View").with
32
-
33
- initialize:()-&gt;
34
- @defer(@setup).until(@someObject,"triggers:an:event")
35
-
36
- setup: ()-&gt;</code></pre>
37
- <h2>Component Bindings</h2>
38
- <p>Luca provides a number of configuration API for its components
39
- which facilitate the binding of a component's methods to events that
40
- occur on instances of the CollectionManager and Application objects.
41
-
42
- </p>
43
- <p>For Luca.core.Container classes there is also a component events
44
- binding API that allows you to declare in your container which events
45
- to listen for on that container's components
46
-
47
- </p>
48
- <h2>Auto Context Binding For Event Handlers</h2>
49
- <p>By setting the @bindAllEvents property to true on your prototype definitions,
50
- all event handler methods on your view will automatically be bound to the context
51
- of the view.
52
-
53
- </p>
54
- <pre><code class="lang-coffeescript"> _.def('MyApp.views.AutoBoundView').extends('Luca.View').with
55
-
56
- bindAllEvents: true
57
-
58
- events:
59
- "click a.btn" : "clickHandler"
60
- "click a.btn.btn-danger" : "dangerHandler"
61
-
62
- initialize:()-&gt;
63
- # You no longer need to do this
64
- # if you want to have these handlers run
65
- # in the context of this view
66
- _.bindAll @, "clickHandler", "dangerHandler"</code></pre>
67
- <h2>Collection Manager Event Binding</h2>
68
- <p>Luca Applications which use the Luca.CollectionManager have the benefit of
69
- a declarative event binding syntax which allows you bind to events on collections
70
- by their name. This saves you from having to create a reference to the collection
71
- in some method, and setup a callback binding. By simply providing a @collectionEvents
72
- configuration property on your views, you can eliminate a lot of boilerplate in your components.
73
-
74
- </p>
75
- <p>The format of the @collectionEvents hash is a key which is made up of the collection's name and the event
76
- separated by a space, and either a function or a name of a method on your view.
77
-
78
- </p>
79
- <pre><code class="lang-coffeescript"> SamplesCollection = Backbone.Collection.extend
80
- name: "samples"
81
- url: "/api/v1/samples"
82
-
83
- _.def("MyView").extends("Luca.View").with
84
- # NOTE: you may omit this property and
85
- # it will use Luca.CollectionManager.get() to
86
- # get the main instance.
87
- collectionManager: "main"
88
-
89
- collectionEvents:
90
- "samples reset" : "samplesResetHandler"
91
-
92
- samplesResetHandler: (collection)-&gt;
93
- if collection.length &gt; 1
94
- @doSomething()</code></pre>
95
- <h2>Application Event Binding</h2>
96
- <p>Similar to the CollectionManager event binding API, there is a similar API for binding to the global application
97
- object. Most applications will have a single application instance, that is either available on the global object
98
- or through a call to <code>Luca.getApplication()</code>.
99
-
100
- </p>
101
- <p>It is in the Application instance that global state tracking should occur. Should your views want to respond to changes
102
- in global application state, you can provide an @applicationEvents configuration property. The format is a key value
103
- pair, where the key represents the event being triggered by the application, and the value is a name of a method on
104
- your view or an anonymous function.
105
-
106
- </p>
107
- <pre><code class="lang-coffeescript"> App = new Luca.Application
108
- name: "main"
109
-
110
- defaultState:
111
- currentMode: "solid"
112
-
113
- _.def("AppBoundView").extends("Luca.View").with
114
- # NOTE: you may omit this and it will use Luca.getApplication()
115
- app: "main"
116
-
117
- applicationEvents:
118
- "change:currentMode" : "modeChangeHandler"
119
-
120
- modeChangeHandler: ()-&gt;
121
- @doSomething()</code></pre>
122
- <h2>Luca.core.Container Component Events</h2>
123
- <p>Containers are special views whose only purpose is to render multiple components in a specified configuration, and handle
124
- all of the communication between the components. This is what allows Luca components to be extremely re-usable, because they
125
- never know about views that exist outside of them.
126
-
127
- </p>
128
- <p>By providing a @componentEvents configuration property on your container, you can bind to events on the components in your container
129
- and relay information about them to other members of the container. The format is a key value pair where the key is a string which
130
- contains the name of the component and the event it triggers, separated by a space. The value is a name of a method on your view or an anonymous function.
131
-
132
- </p>
133
- <pre><code class="lang-coffeescript"> # ctype = component_one
134
- _.def("ComponentOne").extends("Luca.View").with
135
- name:"one"
136
- eventHandler: ()-&gt;
137
- @trigger "custom:event"
138
-
139
- # ctype = component_two
140
- _.def("ComponentTwo").extends("ComponentOne").with
141
- name:"two"
142
- eventHandler: ()-&gt;
143
- @trigger "some:other:event"
144
-
145
- _.def("MyContainer").extends("Luca.core.Container").with
146
- components:["component_two","component_one"]
147
- componentEvents:
148
- "one custom:event" : "customEventHandler"
149
-
150
- # when component named one fires an event
151
- # we can handle it here, pass it to two, whatever
152
- customEventHandler: ()-&gt;
153
- Luca('two').eventHandler()</code></pre>