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
@@ -0,0 +1,77 @@
1
+ [HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
2
+ table of contents](README.md)
3
+
4
+ # Frequently asked questions
5
+
6
+ ### Why is the URL for jQuery without "http"?
7
+
8
+ This is an intentional use of [protocol-relative
9
+ URLs](http://paulirish.com/2010/the-protocol-relative-url/)
10
+
11
+ **N.B.** Using a protocol-relative URL for files that exist on a CDN is
12
+ problematic when you try to view your local files directly in the browser. The
13
+ browser will attempt to fetch the file from your local file system. We
14
+ recommend that you use a local server to test your pages (or Dropbox). This can
15
+ be done using Python by running `python -m SimpleHTTPServer` from your local
16
+ directory, using Ruby by installing and running
17
+ [asdf](https://rubygems.org/gems/asdf), and by installing any one of XAMPP,
18
+ MAMP, or WAMP.
19
+
20
+
21
+ ### Why don't you automatically load the latest version of jQuery from the Google CDN?
22
+
23
+ 1. The latest version of jQuery may not be compatible with the existing
24
+ plugins/code on the site. Version updating should be an intentional
25
+ decision.
26
+ 2. The latest version has a very short `max-age=3600` compares to the specific
27
+ version of `max-age=31536000`, which means you won't get the benefits of
28
+ long-term caching.
29
+
30
+
31
+ ### Why is the Google Analytics code at the bottom? Google recommends it be placed the `head`.
32
+
33
+ The advantage to placing it in the `head` is that you will track a user's
34
+ pageview even if they leave the page before it has been fully loaded. However,
35
+ putting the code at the bottom keeps all the scripts together and reinforces
36
+ that scripts at the bottom are the right move.
37
+
38
+
39
+ ### How can I integrate [Twitter Bootstrap](http://twitter.github.com/bootstrap/) with HTML5 Boilerplate?
40
+
41
+ You can use [Initializr](http://initializr.com) to create a custom build that
42
+ includes HTML5 Boilerplate with Twitter Bootstrap.
43
+
44
+ Read more about how [HTML5 Boilerplate and Twitter Bootstrap complement each
45
+ other](http://www.quora.com/Is-Bootstrap-a-complement-OR-an-alternative-to-HTML5-Boilerplate-or-viceversa/answer/Nicolas-Gallagher).
46
+
47
+
48
+ ### How do I prevent phone numbers looking twice as large and having a Skype highlight?
49
+
50
+ If this is occurring, it is because a user has the Skype browser extension
51
+ installed.
52
+
53
+ Use the following CSS to prevent Skype from formatting the numbers on your
54
+ page:
55
+
56
+ ```css
57
+ span.skype_pnh_container {
58
+ display: none !important;
59
+ }
60
+
61
+ span.skype_pnh_print_container {
62
+ display: inline !important;
63
+ }
64
+ ```
65
+
66
+
67
+ ### Do I need to upgrade my sites each time a new version of HTML5 Boilerplate is released?
68
+
69
+ No. You don't normally replace the foundations of a house once it has been
70
+ built. There is nothing stopping you from trying to work in the latest changes
71
+ but you'll have to assess the costs/benefits of doing so.
72
+
73
+
74
+ ### Where can I get help for support questions?
75
+
76
+ Please ask for help on
77
+ [StackOverflow](http://stackoverflow.com/questions/tagged/html5boilerplate).
@@ -0,0 +1,323 @@
1
+ [HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
2
+ table of contents](README.md)
3
+
4
+ # .htaccess
5
+
6
+ In Apache HTTP server, `.htaccess` (hypertext access) is the configuration file
7
+ that allows for web server configuration. HTML5 Boilerplate includes a number
8
+ of best practice server rules for making web pages fast and secure, these rules
9
+ can be applied by configuring `.htaccess` file.
10
+
11
+ **You'll want to have these modules enabled for optimum performance:**
12
+
13
+ * `mod_setenvif.c` (setenvif_module)
14
+ * `mod_headers.c` (headers_module)
15
+ * `mod_deflate.c` (deflate_module)
16
+ * `mod_filter.c` (filter_module)
17
+ * `mod_expires.c` (expires_module)
18
+ * `mod_rewrite.c` (rewrite_module)
19
+
20
+
21
+ ## On Windows
22
+
23
+ You've got a couple of options that depend on how you installed Apache.
24
+
25
+ 1. **WampServer**. This is by far the simplest option. If you have installed
26
+ WampServer just click on the icon in the task bar, hover over the Apache
27
+ section in the menu that comes up and then hover over the modules section.
28
+ You will be presented with a list of modules. Simply click on a module name
29
+ to enable it (or disable it if it is already enabled). A check mark next to
30
+ a module indicates that it is enabled. WampServer will automatically restart
31
+ the Apache service after you enable a module.
32
+
33
+ 2. **Manually editing `httpd.conf`**. This assumes that you have manually
34
+ installed Apache. You will need to locate the `httpd.conf` file which is
35
+ normally in the `conf` folder in the folder where you installed Apache (for
36
+ example `C:\apache\conf\httpd.conf`). Open up this file in a text editor. Near
37
+ the top (after a bunch of comments) you will see a long list of modules. Check
38
+ to make sure that the modules listed above are not commented out. If they
39
+ are, go ahead and uncomment them and restart Apache.
40
+
41
+ That's it, you're done!
42
+
43
+
44
+ ## On Linux
45
+
46
+ These instructions should work on any distribution where `apt-get` has been
47
+ used to install Apache.
48
+
49
+ 1. Open up a terminal and type the following command. Enter your password when
50
+ prompted.
51
+
52
+ `sudo a2enmod setenvif headers deflate filter expires rewrite include`
53
+
54
+ 1. Restart apache by using the following command so the new configuration takes
55
+ effect.
56
+
57
+ `sudo /etc/init.d/apache2 restart`
58
+
59
+ That's it, you're done!
60
+
61
+
62
+ ## On Mac
63
+
64
+ Coming soon...
65
+
66
+
67
+ ## Security
68
+
69
+ Do not turn off your ServerSignature (i.e., the `Server:` HTTP header). Serious
70
+ attackers can use other kinds of fingerprinting methods to figure out the
71
+ actual server and components running behind a port. Instead, as a site owner,
72
+ you should keep track of what's listening on ports on hosts that you control.
73
+ Run a periodic scanner to make sure nothing suspicious is running on a host you
74
+ control, and use the ServerSignature to determine if this is the web server and
75
+ version that you expect.
76
+
77
+
78
+ ## Performance
79
+
80
+ ### Configure ETags
81
+
82
+ ```apache
83
+ FileETag None
84
+ ```
85
+
86
+ Entity tags (ETags) is a mechanism that web servers and browsers use to
87
+ determine whether the component in the browser's cache matches the one on the
88
+ origin server. (An "entity" is another word a "component": images, scripts,
89
+ stylesheets, etc.) ETags were added to provide a mechanism for validating
90
+ entities that is more flexible than the last-modified date. An `ETag` is a
91
+ string that uniquely identifies a specific version of a component. The only
92
+ format constraints are that the string be quoted. The origin server specifies
93
+ the component's `ETag` using the `ETag` response header.
94
+
95
+ ```http
96
+ HTTP/1.1 200 OK
97
+ Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
98
+ ETag: "10c24bc-4ab-457e1c1f"
99
+ Content-Length: 12195
100
+ ```
101
+
102
+ Later, if the browser has to validate a component, it uses the `If-None-Match`
103
+ header to pass the `ETag` back to the origin server. If the ETags match, a 304
104
+ status code is returned reducing the response by 12195 bytes for this
105
+ example.
106
+
107
+ ```http
108
+ GET /i/yahoo.gif HTTP/1.1
109
+ Host: us.yimg.com
110
+ If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
111
+ If-None-Match: "10c24bc-4ab-457e1c1f"
112
+ HTTP/1.1 304 Not Modified
113
+ ```
114
+
115
+ The problem with ETags is that they typically are constructed using attributes
116
+ that make them unique to a specific server hosting a site. ETags won't match
117
+ when a browser gets the original component from one server and later tries to
118
+ validate that component on a different server, a situation that is all too
119
+ common on web sites that use a cluster of servers to handle requests. By
120
+ default, both Apache and IIS embed data in the ETag that dramatically reduces
121
+ the odds of the validity test succeeding on web sites with multiple servers.
122
+
123
+ The ETag format for Apache 1.3 and 2.x is inode-size-timestamp. Although a
124
+ given file may reside in the same directory across multiple servers, and have
125
+ the same file size, permissions, timestamp, etc., its inode is different from
126
+ one server to the next.
127
+
128
+ IIS 5.0 and 6.0 have a similar issue with ETags. The format for ETags on IIS is
129
+ Filetimestamp:ChangeNumber. A ChangeNumber is a counter used to track
130
+ configuration changes to IIS. It's unlikely that the ChangeNumber is the same
131
+ across all IIS servers behind a web site.
132
+
133
+ The end result is ETags generated by Apache and IIS for the exact same
134
+ component won't match from one server to another. If the ETags don't match, the
135
+ user doesn't receive the small, fast 304 response that ETags were designed for;
136
+ instead, they'll get a normal 200 response along with all the data for the
137
+ component. If you host your web site on just one server, this isn't a problem.
138
+ But if you have multiple servers hosting your web site, and you're using Apache
139
+ or IIS with the default ETag configuration, your users are getting slower
140
+ pages, your servers have a higher load, you're consuming greater bandwidth, and
141
+ proxies aren't caching your content efficiently. Even if your components have a
142
+ far future Expires header, a conditional GET request is still made whenever the
143
+ user hits Reload or Refresh.
144
+
145
+ If you're not taking advantage of the flexible validation model that ETags
146
+ provide, it's better to just remove the ETag altogether. The Last-Modified
147
+ header validates based on the component's timestamp. And removing the ETag
148
+ reduces the size of the HTTP headers in both the response and subsequent
149
+ requests. This Microsoft Support article describes how to remove ETags. In
150
+ Apache, this is done by simply adding the above line to your Apache
151
+ configuration file.
152
+
153
+
154
+ ### Gzip Components
155
+
156
+ Compression reduces response times by reducing the size of the HTTP response.
157
+
158
+ Starting with HTTP/1.1, web clients indicate support for compression with the
159
+ Accept-Encoding header in the HTTP request.
160
+
161
+ ```
162
+ Accept-Encoding: gzip, deflate
163
+ ```
164
+
165
+ If the web server sees this header in the request, it may compress the response
166
+ using one of the methods listed by the client. The web server notifies the web
167
+ client of this via the Content-Encoding header in the response.
168
+
169
+ ```
170
+ Content-Encoding: gzip
171
+ ```
172
+
173
+ Gzip is the most popular and effective compression method at this time. It was
174
+ developed by the GNU project and standardized by RFC 1952. The only other
175
+ compression format you're likely to see is deflate, but it's less effective and
176
+ less popular.
177
+
178
+ Gzipping generally reduces the response size by about 70%. Approximately 90% of
179
+ today's Internet traffic travels through browsers that claim to support gzip.
180
+ If you use Apache, the module configuring gzip depends on your version: Apache
181
+ 1.3 uses `mod_gzip` while Apache 2.x uses `mod_deflate`.
182
+
183
+ There are known issues with browsers and proxies that may cause a mismatch in
184
+ what the browser expects and what it receives with regard to compressed
185
+ content. Fortunately, these edge cases are dwindling as the use of older
186
+ browsers drops off. The Apache modules help out by adding appropriate Vary
187
+ response headers automatically.
188
+
189
+ Servers choose what to gzip based on file type, but are typically too limited
190
+ in what they decide to compress. Most web sites gzip their HTML documents. It's
191
+ also worthwhile to gzip your scripts and stylesheets, but many web sites miss
192
+ this opportunity. In fact, it's worthwhile to compress any text response
193
+ including XML and JSON. Image and PDF files should not be gzipped because they
194
+ are already compressed. Trying to gzip them not only wastes CPU but can
195
+ potentially increase file sizes.
196
+
197
+ Gzipping as many appropriate file types as possible is an easy way to reduce
198
+ page weight and accelerate the user experience.
199
+
200
+
201
+ ### Cache busting
202
+
203
+ A first-time visitor to your page may have to make several HTTP requests, but
204
+ by using the Expires header you make those components cacheable. This avoids
205
+ unnecessary HTTP requests on subsequent page views. Expires headers are most
206
+ often used with images, but they should be used on all components including
207
+ scripts, stylesheets, etc.
208
+
209
+ Traditionally, if you use a far future Expires header you have to change the
210
+ component's filename whenever the component changes.
211
+
212
+ The H5BP `.htaccess` has built-in filename cache busting. To use it, uncomment
213
+ the relevant lines in the `.htaccess` file.
214
+
215
+ Doing so will route all requests for `/path/filename.20120101.ext` to
216
+ `/path/filename.ext`. To use this, just add a time-stamp number (or your own
217
+ numbered versioning system) into your resource filenames in your HTML source
218
+ whenever you update those resources.
219
+
220
+ #### Example:
221
+
222
+ ```html
223
+ <script src="/js/myscript.20120305.js"></script>
224
+ <script src="/js/jqueryplugin.45.js"></script>
225
+ <link rel="stylesheet" href="css/somestyle.49559939932.css">
226
+ <link rel="stylesheet" href="css/anotherstyle.2.css">
227
+ ```
228
+
229
+ **N.B. You do not have to rename the resource on the filesystem.** All you have
230
+ to do is add the timestamp number to the filename in your HTML source. The
231
+ `.htaccess` directive will serve up the proper file.
232
+
233
+ Traditional cache busting involved adding a query string to the end of your
234
+ JavaScript or CSS filename whenever you updated it.
235
+
236
+ ```html
237
+ <script src="/js/all.js?v=12"></script>
238
+ ```
239
+
240
+ However, as [Steve Souders](http://stevesouders.com/) explains in [*Revving
241
+ Filenames: don’t use
242
+ querystring*](http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/),
243
+ the query string approach is not always reliable for clients behind a Squid
244
+ Proxy Server.
245
+
246
+
247
+ ## Trailing slash redirects
248
+
249
+ Trailing slash redirects can be done by adding one of the options below in `.htaccess`.
250
+
251
+ ### Option 1
252
+ Rewrite `domain.com/foo` -> `domain.com/foo/`.
253
+
254
+ ```apache
255
+ RewriteCond %{REQUEST_FILENAME} !-f
256
+ RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/|#(.*))$
257
+ RewriteRule ^(.*)$ $1/ [R=301,L]
258
+ ```
259
+
260
+ ### Option 2
261
+ Rewrite `domain.com/foo/` -> `domain.com/foo`
262
+
263
+ ```apache
264
+ RewriteRule ^(.*)/$ $1 [R=301,L]
265
+ ```
266
+
267
+ Here are some tips to show you how to integrate the rewrite rules with
268
+ different CMS tools. There are four areas you need to look out for:
269
+
270
+ ### 1. Keep a backup
271
+
272
+ If you use trailing slash redirects on an existing site, always keep a backup
273
+ of your `.htaccess` and test thoroughly on your staging server before using it on
274
+ a production server.
275
+
276
+ ### 2. Don't replace existing rules, merge
277
+
278
+ For example, if you use CodeIgniter you may have existing URL rewrite rules like:
279
+
280
+ ```apache
281
+ RewriteCond %{REQUEST_FILENAME} !-f
282
+ RewriteCond %{REQUEST_FILENAME} !-d
283
+ RewriteRule ^(.*)$ index.php/$1
284
+ ```
285
+
286
+ Merge the above with H5BP rules below:
287
+
288
+ ```apache
289
+ RewriteCond %{REQUEST_FILENAME} !-f
290
+ RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/|#(.*))$
291
+ RewriteRule ^(.*)$ $1/ [R=301,L]
292
+ ```
293
+
294
+ ### 3. Be careful of the order
295
+
296
+ Make sure you test thoroughly in your staging environment. For the above
297
+ example, the order is add trailing slash first, and add your existing rule
298
+ after:
299
+
300
+ ```apache
301
+ # this adds trailing slash
302
+ RewriteCond %{REQUEST_FILENAME} !-f
303
+ RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/|#(.*))$
304
+ RewriteRule ^(.*)$ $1/ [R=301,L]
305
+
306
+ # this gets rid of index.php
307
+ RewriteCond %{REQUEST_FILENAME} !-f
308
+ RewriteCond %{REQUEST_FILENAME} !-d
309
+ RewriteRule ^(.*)$ index.php/$1
310
+ ```
311
+
312
+ ### 4. Double-check `RewriteBase` path is correct
313
+
314
+ Make sure your `RewriteBase` path points to the correct location and sits above
315
+ any rewrite rules. This usually happens to those have WordPress and ran the
316
+ auto install. For instance, if you have a site at `example.com/blog`, your
317
+ RewriteBase may look like:
318
+
319
+ ```apache
320
+ RewriteBase /blog/
321
+ ```
322
+
323
+ If you already have a working RewriteBase, keep that and don't remove it.
@@ -0,0 +1,170 @@
1
+ [HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
2
+ table of contents](README.md)
3
+
4
+ # The HTML
5
+
6
+ ## Conditional `html` classes
7
+
8
+ A series of IE conditional comments apply the relevant IE-specific classes to
9
+ the `html` tag. This provides one method of specifying CSS fixes for specific
10
+ legacy versions of IE. While you may or may not choose to use this technique in
11
+ your project code, HTML5 Boilerplate's default CSS does not rely on it.
12
+
13
+ When using the conditional classes technique, applying classes to the `html`
14
+ element has several benefits:
15
+
16
+ * It avoids a [file blocking
17
+ issue](http://webforscher.wordpress.com/2010/05/20/ie-6-slowing-down-ie-8/)
18
+ discovered by Stoyan Stefanov and Markus Leptien.
19
+ * It avoids the need for an empty comment that also fixes the above issue.
20
+ * CMSes like WordPress and Drupal use the body class more heavily. This makes
21
+ integrating there a touch simpler.
22
+ * It still validates as HTML5.
23
+ * It uses the same element as Modernizr (and Dojo). That feels nice.
24
+ * It can improve the clarity of code in multi-developer teams.
25
+
26
+
27
+ ## The `no-js` class
28
+
29
+ Allows you to more easily explicitly add custom styles when JavaScript is
30
+ disabled (`no-js`) or enabled (`js`). More here: [Avoiding the
31
+ FOUC](http://paulirish.com/2009/avoiding-the-fouc-v3/).
32
+
33
+
34
+ ## The order of meta tags, and `<title>`
35
+
36
+ As recommended by [the HTML5
37
+ spec](http://www.whatwg.org/specs/web-apps/current-work/complete/semantics.html#charset)
38
+ (4.2.5.5 Specifying the document's character encoding), add your charset
39
+ declaration early (before any ASCII art ;) to avoid a potential
40
+ [encoding-related security
41
+ issue](http://code.google.com/p/doctype/wiki/ArticleUtf7) in IE. It should come
42
+ in the first [1024
43
+ bytes](http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#charset).
44
+
45
+ The charset should also come before the `<title>` tag, due to [potential XSS
46
+ vectors](http://code.google.com/p/doctype-mirror/wiki/ArticleUtf7).
47
+
48
+ The meta tag for compatibility mode [needs to be before all elements except
49
+ title and meta](http://h5bp.com/f "Defining Document Compatibility - MSDN").
50
+ And that same meta tag can only be invoked for Google Chrome Frame if it is
51
+ within the [first 1024
52
+ bytes](http://code.google.com/p/chromium/issues/detail?id=23003).
53
+
54
+
55
+ ## X-UA-Compatible
56
+
57
+ This makes sure the latest version of IE is used in versions of IE that contain
58
+ multiple rendering engines. Even if a site visitor is using IE8 or IE9, it's
59
+ possible that they're not using the latest rendering engine their browser
60
+ contains. To fix this, use:
61
+
62
+ ```html
63
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
64
+ ```
65
+
66
+ The `meta` tag tells the IE rendering engine two things:
67
+
68
+ 1. It should use the latest, or edge, version of the IE rendering environment
69
+ 2. If already installed, it should use the Google Chrome Frame rendering
70
+ engine.
71
+
72
+ This `meta` tag ensures that anyone browsing your site in IE is treated to the
73
+ best possible user experience that their browser can offer.
74
+
75
+ This line breaks validation, and the Google Chrome Frame part won't work inside
76
+ a conditional comment. To avoid these edge case issues it is recommended that
77
+ you **remove this line and use the `.htaccess`** (or other server config)
78
+ to send these headers instead. You also might want to read [Validating:
79
+ X-UA-Compatible](http://groups.google.com/group/html5boilerplate/browse_thread/thread/6d1b6b152aca8ed2).
80
+
81
+ If you are serving your site on a non-standard port, you will need to set this
82
+ header on the server-side. This is because the IE preference option 'Display
83
+ intranet sites in Compatibility View' is checked by default.
84
+
85
+
86
+ ## Mobile viewport
87
+
88
+ There are a few different options that you can use with the [`viewport` meta
89
+ tag](https://docs.google.com/present/view?id=dkx3qtm_22dxsrgcf4 "Viewport and
90
+ Media Queries - The Complete Idiot's Guide"). You can find out more in [the
91
+ Apple developer docs](http://j.mp/mobileviewport). HTML5 Boilerplate comes with
92
+ a simple setup that strikes a good balance for general use cases.
93
+
94
+ ```html
95
+ <meta name="viewport" content="width=device-width">
96
+ ```
97
+
98
+ ## Favicons and Touch Icons
99
+
100
+ The shortcut icons should be put in the root directory of your site. HTML5
101
+ Boilerplate comes with a default set of icons (include favicon and Apple Touch
102
+ Icons) that you can use as a baseline to create your own.
103
+
104
+ If your site or icons are in a sub-directory, you will need to reference the
105
+ icons using `link` elements placed in the HTML `head` of your document.
106
+
107
+ For a comprehensive overview, please read [Everything you always wanted to know
108
+ about touch icons](http://mathiasbynens.be/notes/touch-icons) by Mathias
109
+ Bynens.
110
+
111
+
112
+ ## Modernizr
113
+
114
+ HTML5 Boilerplate uses a custom build of Modernizr.
115
+
116
+ [Modernizr](http://modernizr.com) is a JavaScript library which adds classes to
117
+ the `html` element based on the results of feature test and which ensures that
118
+ all browsers can make use of HTML5 elements (as it includes the HTML5 Shiv).
119
+ This allows you to target parts of your CSS and JavaScript based on the
120
+ features supported by a browser.
121
+
122
+ In general, in order to keep page load times to a minimum, it's best to call
123
+ any JavaScript at the end of the page because if a script is slow to load
124
+ from an external server it may cause the whole page to hang. That said, the
125
+ Modernizr script *needs* to run *before* the browser begins rendering the page,
126
+ so that browsers lacking support for some of the new HTML5 elements are able to
127
+ handle them properly. Therefore the Modernizr script is the only JavaScript
128
+ file synchronously loaded at the top of the document.
129
+
130
+
131
+ ## The content area
132
+
133
+ The central part of the boilerplate template is pretty much empty. This is
134
+ intentional, in order to make the boilerplate suitable for both web page and
135
+ web app development.
136
+
137
+ ### Google Chrome Frame
138
+
139
+ The main content area of the boilerplate includes a prompt to install Chrome
140
+ Frame (which no longer requires administrative rights) for users of IE 6. If
141
+ you intended to support IE 6, then you should remove the snippet of code.
142
+
143
+ ### Google CDN for jQuery
144
+
145
+ The Google CDN version of the jQuery JavaScript library is referenced towards
146
+ the bottom of the page using a protocol-independent path (read more about this
147
+ in the [FAQ](faq.md). A local fallback of jQuery is included for rare instances
148
+ when the CDN version might not be available, and to facilitate offline
149
+ development.
150
+
151
+ Regardless of which JavaScript library you choose to use, it is well worth the
152
+ time and effort to look up and reference the Google CDN (Content Delivery
153
+ Network) version. Your users may already have this version cached in their
154
+ browsers, and Google's CDN is likely to deliver the asset faster than your
155
+ server.
156
+
157
+ ### Google Analytics Tracking Code
158
+
159
+ Finally, an optimized version of the latest Google Analytics tracking code is
160
+ included. Google recommends that this script be placed at the top of the page.
161
+ Factors to consider: if you place this script at the top of the page, you’ll be
162
+ able to count users who don’t fully load the page, and you’ll incur the max
163
+ number of simultaneous connections of the browser.
164
+
165
+ Further information:
166
+
167
+ * [Optimizing the asynchronous Google Analytics
168
+ snippet](http://mathiasbynens.be/notes/async-analytics-snippet).
169
+ * [Tracking Site Activity - Google
170
+ Analytics](http://code.google.com/apis/analytics/docs/tracking/asyncTracking.html).