alchemy_cms 5.3.4 → 6.0.0.b1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (295) hide show
  1. checksums.yaml +4 -4
  2. data/.github/workflows/ci.yml +6 -14
  3. data/.gitignore +1 -1
  4. data/.hound.yml +1 -1
  5. data/.rubocop.yml +46 -4
  6. data/CHANGELOG.md +80 -69
  7. data/Gemfile +4 -2
  8. data/README.md +5 -2
  9. data/Rakefile +0 -18
  10. data/alchemy_cms.gemspec +78 -65
  11. data/app/assets/javascripts/alchemy/admin.js +2 -2
  12. data/app/assets/javascripts/alchemy/alchemy.base.js.coffee +0 -30
  13. data/app/assets/javascripts/alchemy/alchemy.confirm_dialog.js.coffee +2 -1
  14. data/app/assets/javascripts/alchemy/alchemy.dialog.js.coffee +2 -7
  15. data/app/assets/javascripts/alchemy/alchemy.dragndrop.js.coffee +0 -25
  16. data/app/assets/javascripts/alchemy/alchemy.element_editors.js.coffee +1 -1
  17. data/app/assets/javascripts/alchemy/alchemy.elements_window.js.coffee +2 -0
  18. data/app/assets/javascripts/alchemy/alchemy.fixed_elements.js +1 -1
  19. data/app/assets/javascripts/alchemy/alchemy.gui.js.coffee +3 -1
  20. data/app/assets/javascripts/alchemy/alchemy.image_overlay.coffee +1 -1
  21. data/app/assets/javascripts/alchemy/alchemy.link_dialog.js.coffee +40 -29
  22. data/app/assets/javascripts/alchemy/alchemy.page_sorter.js +24 -0
  23. data/app/assets/javascripts/alchemy/alchemy.sitemap.js.coffee +119 -0
  24. data/app/assets/javascripts/alchemy/page_select.js +8 -13
  25. data/app/assets/javascripts/alchemy/templates/index.js +0 -1
  26. data/app/assets/javascripts/alchemy/templates/node_folder.hbs +1 -1
  27. data/app/assets/javascripts/alchemy/templates/page.hbs +7 -17
  28. data/app/assets/stylesheets/alchemy/admin.scss +1 -1
  29. data/app/assets/stylesheets/alchemy/archive.scss +4 -8
  30. data/app/assets/stylesheets/alchemy/buttons.scss +0 -4
  31. data/app/assets/stylesheets/alchemy/elements.scss +73 -61
  32. data/app/assets/stylesheets/alchemy/images.scss +8 -0
  33. data/app/assets/stylesheets/alchemy/node-select.scss +4 -3
  34. data/app/assets/stylesheets/alchemy/page-select.scss +5 -29
  35. data/app/assets/stylesheets/alchemy/sitemap.scss +7 -9
  36. data/app/assets/stylesheets/tinymce/skins/alchemy/content.min.css.scss +3 -3
  37. data/app/assets/stylesheets/tinymce/skins/alchemy/skin.min.css.scss +7 -7
  38. data/app/controllers/alchemy/admin/attachments_controller.rb +6 -2
  39. data/app/controllers/alchemy/admin/base_controller.rb +8 -16
  40. data/app/controllers/alchemy/admin/elements_controller.rb +58 -34
  41. data/app/controllers/alchemy/admin/essence_audios_controller.rb +30 -0
  42. data/app/controllers/alchemy/admin/essence_files_controller.rb +0 -14
  43. data/app/controllers/alchemy/admin/essence_pictures_controller.rb +8 -79
  44. data/app/controllers/alchemy/admin/essence_videos_controller.rb +33 -0
  45. data/app/controllers/alchemy/admin/ingredients_controller.rb +30 -0
  46. data/app/controllers/alchemy/admin/layoutpages_controller.rb +0 -1
  47. data/app/controllers/alchemy/admin/pages_controller.rb +19 -23
  48. data/app/controllers/alchemy/admin/pictures_controller.rb +35 -9
  49. data/app/controllers/alchemy/api/elements_controller.rb +10 -5
  50. data/app/controllers/alchemy/api/pages_controller.rb +3 -15
  51. data/app/controllers/concerns/alchemy/admin/archive_overlay.rb +13 -3
  52. data/app/controllers/concerns/alchemy/admin/crop_action.rb +26 -0
  53. data/app/decorators/alchemy/element_editor.rb +23 -1
  54. data/app/decorators/alchemy/ingredient_editor.rb +154 -0
  55. data/app/helpers/alchemy/admin/elements_helper.rb +1 -0
  56. data/app/helpers/alchemy/admin/essences_helper.rb +1 -1
  57. data/app/helpers/alchemy/admin/ingredients_helper.rb +42 -0
  58. data/app/helpers/alchemy/elements_block_helper.rb +22 -7
  59. data/app/helpers/alchemy/elements_helper.rb +14 -7
  60. data/app/helpers/alchemy/pages_helper.rb +3 -11
  61. data/app/jobs/alchemy/base_job.rb +11 -0
  62. data/app/jobs/alchemy/publish_page_job.rb +11 -0
  63. data/app/models/alchemy/attachment.rb +1 -1
  64. data/app/models/alchemy/content/factory.rb +23 -27
  65. data/app/models/alchemy/content.rb +1 -6
  66. data/app/models/alchemy/element/definitions.rb +29 -27
  67. data/app/models/alchemy/element/element_contents.rb +131 -122
  68. data/app/models/alchemy/element/element_essences.rb +100 -98
  69. data/app/models/alchemy/element/element_ingredients.rb +176 -0
  70. data/app/models/alchemy/element/presenters.rb +89 -87
  71. data/app/models/alchemy/element.rb +40 -73
  72. data/app/models/alchemy/elements_repository.rb +126 -0
  73. data/app/models/alchemy/essence_audio.rb +12 -0
  74. data/app/models/alchemy/essence_headline.rb +40 -0
  75. data/app/models/alchemy/essence_picture.rb +4 -116
  76. data/app/models/alchemy/essence_richtext.rb +12 -0
  77. data/app/models/alchemy/essence_video.rb +12 -0
  78. data/app/models/alchemy/image_cropper_settings.rb +87 -0
  79. data/app/models/alchemy/ingredient.rb +219 -0
  80. data/app/models/alchemy/ingredient_validator.rb +97 -0
  81. data/app/models/alchemy/ingredients/audio.rb +29 -0
  82. data/app/models/alchemy/ingredients/boolean.rb +21 -0
  83. data/app/models/alchemy/ingredients/datetime.rb +20 -0
  84. data/app/models/alchemy/ingredients/file.rb +30 -0
  85. data/app/models/alchemy/ingredients/headline.rb +42 -0
  86. data/app/models/alchemy/ingredients/html.rb +19 -0
  87. data/app/models/alchemy/ingredients/link.rb +16 -0
  88. data/app/models/alchemy/ingredients/node.rb +23 -0
  89. data/app/models/alchemy/ingredients/page.rb +23 -0
  90. data/app/models/alchemy/ingredients/picture.rb +41 -0
  91. data/app/models/alchemy/ingredients/richtext.rb +57 -0
  92. data/app/models/alchemy/ingredients/select.rb +10 -0
  93. data/app/models/alchemy/ingredients/text.rb +17 -0
  94. data/app/models/alchemy/ingredients/video.rb +33 -0
  95. data/app/models/alchemy/language.rb +0 -11
  96. data/app/models/alchemy/node.rb +1 -1
  97. data/app/models/alchemy/page/fixed_attributes.rb +53 -51
  98. data/app/models/alchemy/page/page_elements.rb +186 -205
  99. data/app/models/alchemy/page/page_naming.rb +66 -64
  100. data/app/models/alchemy/page/page_natures.rb +139 -142
  101. data/app/models/alchemy/page/page_scopes.rb +113 -102
  102. data/app/models/alchemy/page/publisher.rb +50 -0
  103. data/app/models/alchemy/page/url_path.rb +1 -1
  104. data/app/models/alchemy/page.rb +69 -36
  105. data/app/models/alchemy/page_version.rb +58 -0
  106. data/app/models/alchemy/picture/calculations.rb +2 -8
  107. data/app/models/alchemy/picture/preprocessor.rb +2 -0
  108. data/app/models/alchemy/picture/transformations.rb +21 -93
  109. data/app/models/alchemy/picture.rb +4 -2
  110. data/app/models/concerns/alchemy/picture_thumbnails.rb +181 -0
  111. data/app/models/concerns/alchemy/touch_elements.rb +2 -2
  112. data/app/presenters/alchemy/picture_view.rb +88 -0
  113. data/app/serializers/alchemy/element_serializer.rb +5 -0
  114. data/app/serializers/alchemy/page_serializer.rb +1 -7
  115. data/app/serializers/alchemy/page_tree_serializer.rb +6 -5
  116. data/app/services/alchemy/delete_elements.rb +44 -0
  117. data/app/services/alchemy/duplicate_element.rb +56 -0
  118. data/app/views/alchemy/admin/attachments/_archive_overlay.html.erb +1 -2
  119. data/app/views/alchemy/admin/attachments/_file_to_assign.html.erb +3 -3
  120. data/app/views/alchemy/admin/attachments/assign.js.erb +11 -0
  121. data/app/views/alchemy/admin/crop.html.erb +36 -0
  122. data/app/views/alchemy/admin/elements/_element.html.erb +14 -10
  123. data/app/views/alchemy/admin/elements/{_element_footer.html.erb → _footer.html.erb} +0 -0
  124. data/app/views/alchemy/admin/elements/{_new_element_form.html.erb → _form.html.erb} +1 -1
  125. data/app/views/alchemy/admin/elements/{_element_header.html.erb → _header.html.erb} +1 -1
  126. data/app/views/alchemy/admin/elements/{_element_toolbar.html.erb → _toolbar.html.erb} +5 -6
  127. data/app/views/alchemy/admin/elements/{trash.js.erb → destroy.js.erb} +1 -3
  128. data/app/views/alchemy/admin/elements/new.html.erb +3 -3
  129. data/app/views/alchemy/admin/elements/order.js.erb +0 -17
  130. data/app/views/alchemy/admin/elements/update.js.erb +3 -2
  131. data/app/views/alchemy/admin/essence_audios/edit.html.erb +7 -0
  132. data/app/views/alchemy/admin/essence_pictures/update.js.erb +0 -1
  133. data/app/views/alchemy/admin/essence_videos/edit.html.erb +11 -0
  134. data/app/views/alchemy/admin/ingredients/_audio_fields.html.erb +4 -0
  135. data/app/views/alchemy/admin/ingredients/_file_fields.html.erb +18 -0
  136. data/app/views/alchemy/admin/ingredients/_picture_fields.html.erb +25 -0
  137. data/app/views/alchemy/admin/ingredients/_video_fields.html.erb +8 -0
  138. data/app/views/alchemy/admin/ingredients/edit.html.erb +4 -0
  139. data/app/views/alchemy/admin/layoutpages/edit.html.erb +0 -5
  140. data/app/views/alchemy/admin/nodes/_node.html.erb +2 -2
  141. data/app/views/alchemy/admin/pages/_anchor_link.html.erb +1 -1
  142. data/app/views/alchemy/admin/pages/_external_link.html.erb +1 -1
  143. data/app/views/alchemy/admin/pages/_file_link.html.erb +1 -1
  144. data/app/views/alchemy/admin/pages/_form.html.erb +0 -25
  145. data/app/views/alchemy/admin/pages/_internal_link.html.erb +1 -1
  146. data/app/views/alchemy/admin/pages/_new_page_form.html.erb +5 -16
  147. data/app/views/alchemy/admin/pages/_page.html.erb +133 -111
  148. data/app/views/alchemy/admin/pages/_sitemap.html.erb +16 -10
  149. data/app/views/alchemy/admin/pages/_tinymce_custom_config.html.erb +5 -2
  150. data/app/views/alchemy/admin/pages/_toolbar.html.erb +12 -0
  151. data/app/views/alchemy/admin/pages/edit.html.erb +37 -25
  152. data/app/views/alchemy/admin/pages/fold.js.erb +2 -0
  153. data/app/views/alchemy/admin/pages/index.html.erb +1 -1
  154. data/app/views/alchemy/admin/pages/sort.html.erb +19 -0
  155. data/app/views/alchemy/admin/pages/update.js.erb +0 -7
  156. data/app/views/alchemy/admin/partials/_remote_search_form.html.erb +2 -4
  157. data/app/views/alchemy/admin/partials/_routes.html.erb +8 -19
  158. data/app/views/alchemy/admin/pictures/_filter_and_size_bar.html.erb +4 -8
  159. data/app/views/alchemy/admin/pictures/_infos.html.erb +0 -1
  160. data/app/views/alchemy/admin/pictures/_picture_to_assign.html.erb +4 -4
  161. data/app/views/alchemy/admin/pictures/assign.js.erb +10 -0
  162. data/app/views/alchemy/admin/resources/_form.html.erb +1 -0
  163. data/app/views/alchemy/essences/_essence_audio_editor.html.erb +4 -0
  164. data/app/views/alchemy/essences/_essence_audio_view.html.erb +15 -0
  165. data/app/views/alchemy/essences/_essence_file_editor.html.erb +15 -6
  166. data/app/views/alchemy/essences/_essence_headline_editor.html.erb +36 -0
  167. data/app/views/alchemy/essences/_essence_headline_view.html.erb +10 -0
  168. data/app/views/alchemy/essences/_essence_link_editor.html.erb +8 -4
  169. data/app/views/alchemy/essences/_essence_page_editor.html.erb +1 -1
  170. data/app/views/alchemy/essences/_essence_picture_editor.html.erb +27 -12
  171. data/app/views/alchemy/essences/_essence_text_editor.html.erb +12 -4
  172. data/app/views/alchemy/essences/_essence_video_editor.html.erb +4 -0
  173. data/app/views/alchemy/essences/_essence_video_view.html.erb +18 -0
  174. data/app/views/alchemy/essences/shared/_essence_picture_tools.html.erb +21 -16
  175. data/app/views/alchemy/essences/shared/_linkable_essence_tools.html.erb +2 -2
  176. data/app/views/alchemy/ingredients/_audio_editor.html.erb +5 -0
  177. data/app/views/alchemy/ingredients/_audio_view.html.erb +14 -0
  178. data/app/views/alchemy/ingredients/_boolean_editor.html.erb +11 -0
  179. data/app/views/alchemy/ingredients/_boolean_view.html.erb +1 -0
  180. data/app/views/alchemy/ingredients/_datetime_editor.html.erb +17 -0
  181. data/app/views/alchemy/ingredients/_datetime_view.html.erb +9 -0
  182. data/app/views/alchemy/ingredients/_file_editor.html.erb +50 -0
  183. data/app/views/alchemy/ingredients/_file_view.html.erb +17 -0
  184. data/app/views/alchemy/ingredients/_headline_editor.html.erb +30 -0
  185. data/app/views/alchemy/ingredients/_headline_view.html.erb +9 -0
  186. data/app/views/alchemy/ingredients/_html_editor.html.erb +8 -0
  187. data/app/views/alchemy/ingredients/_html_view.html.erb +1 -0
  188. data/app/views/alchemy/ingredients/_link_editor.html.erb +24 -0
  189. data/app/views/alchemy/ingredients/_link_view.html.erb +9 -0
  190. data/app/views/alchemy/ingredients/_node_editor.html.erb +25 -0
  191. data/app/views/alchemy/ingredients/_node_view.html.erb +1 -0
  192. data/app/views/alchemy/ingredients/_page_editor.html.erb +24 -0
  193. data/app/views/alchemy/ingredients/_page_view.html.erb +4 -0
  194. data/app/views/alchemy/ingredients/_picture_editor.html.erb +59 -0
  195. data/app/views/alchemy/ingredients/_picture_view.html.erb +5 -0
  196. data/app/views/alchemy/ingredients/_richtext_editor.html.erb +12 -0
  197. data/app/views/alchemy/ingredients/_richtext_view.html.erb +3 -0
  198. data/app/views/alchemy/ingredients/_select_editor.html.erb +29 -0
  199. data/app/views/alchemy/ingredients/_select_view.html.erb +1 -0
  200. data/app/views/alchemy/ingredients/_text_editor.html.erb +19 -0
  201. data/app/views/alchemy/ingredients/_text_view.html.erb +16 -0
  202. data/app/views/alchemy/ingredients/_video_editor.html.erb +5 -0
  203. data/app/views/alchemy/ingredients/_video_view.html.erb +17 -0
  204. data/app/views/alchemy/ingredients/shared/_link_tools.html.erb +20 -0
  205. data/app/views/alchemy/ingredients/shared/_picture_tools.html.erb +57 -0
  206. data/config/brakeman.ignore +66 -159
  207. data/config/initializers/dragonfly.rb +2 -0
  208. data/config/locales/alchemy.en.yml +26 -15
  209. data/config/routes.rb +19 -26
  210. data/db/migrate/20201207131309_create_page_versions.rb +19 -0
  211. data/db/migrate/20201207135820_add_page_version_id_to_alchemy_elements.rb +76 -0
  212. data/db/migrate/20210205143548_rename_public_on_and_public_until_on_alchemy_pages.rb +10 -0
  213. data/db/migrate/20210326105046_add_sanitized_body_to_alchemy_essence_richtexts.rb +7 -0
  214. data/db/migrate/20210406093436_add_alchemy_essence_headlines.rb +12 -0
  215. data/db/migrate/20210506135919_create_essence_audios.rb +19 -0
  216. data/db/migrate/20210506140258_create_essence_videos.rb +23 -0
  217. data/db/migrate/20210508091432_create_alchemy_ingredients.rb +22 -0
  218. data/lib/alchemy/admin/preview_url.rb +2 -0
  219. data/lib/alchemy/deprecation.rb +1 -1
  220. data/lib/alchemy/dragonfly/processors/auto_orient.rb +18 -0
  221. data/lib/alchemy/elements_finder.rb +14 -60
  222. data/lib/alchemy/engine.rb +1 -8
  223. data/lib/alchemy/essence.rb +1 -2
  224. data/lib/alchemy/hints.rb +8 -4
  225. data/lib/alchemy/page_layout.rb +0 -13
  226. data/lib/alchemy/permissions.rb +31 -29
  227. data/lib/alchemy/resource.rb +13 -3
  228. data/lib/alchemy/tasks/tidy.rb +29 -0
  229. data/lib/alchemy/test_support/essence_shared_examples.rb +0 -1
  230. data/lib/alchemy/test_support/factories/element_factory.rb +8 -8
  231. data/lib/alchemy/test_support/factories/essence_audio_factory.rb +7 -0
  232. data/lib/alchemy/test_support/factories/essence_video_factory.rb +7 -0
  233. data/lib/alchemy/test_support/factories/ingredient_factory.rb +25 -0
  234. data/lib/alchemy/test_support/factories/page_factory.rb +20 -1
  235. data/lib/alchemy/test_support/factories/page_version_factory.rb +23 -0
  236. data/lib/alchemy/test_support/having_crop_action_examples.rb +170 -0
  237. data/lib/alchemy/test_support/having_picture_thumbnails_examples.rb +646 -0
  238. data/lib/alchemy/test_support/shared_ingredient_editor_examples.rb +21 -0
  239. data/lib/alchemy/test_support/shared_ingredient_examples.rb +57 -0
  240. data/lib/alchemy/test_support.rb +2 -11
  241. data/lib/alchemy/tinymce.rb +17 -0
  242. data/lib/alchemy/upgrader/five_point_zero.rb +0 -32
  243. data/lib/alchemy/upgrader/six_point_zero.rb +21 -0
  244. data/lib/alchemy/upgrader/tasks/add_page_versions.rb +33 -0
  245. data/lib/alchemy/upgrader/tasks/ingredients_migrator.rb +51 -0
  246. data/lib/alchemy/version.rb +1 -1
  247. data/lib/alchemy_cms.rb +0 -1
  248. data/lib/generators/alchemy/elements/elements_generator.rb +1 -0
  249. data/lib/generators/alchemy/elements/templates/view.html.erb +9 -0
  250. data/lib/generators/alchemy/elements/templates/view.html.haml +9 -0
  251. data/lib/generators/alchemy/elements/templates/view.html.slim +9 -0
  252. data/lib/generators/alchemy/ingredient/ingredient_generator.rb +38 -0
  253. data/lib/generators/alchemy/ingredient/templates/editor.html.erb +14 -0
  254. data/lib/generators/alchemy/ingredient/templates/model.rb.tt +13 -0
  255. data/lib/generators/alchemy/ingredient/templates/view.html.erb +1 -0
  256. data/lib/generators/alchemy/install/install_generator.rb +1 -2
  257. data/lib/generators/alchemy/install/templates/dragonfly.rb.tt +1 -1
  258. data/lib/generators/alchemy/menus/templates/node.html.erb +1 -1
  259. data/lib/generators/alchemy/menus/templates/node.html.haml +1 -1
  260. data/lib/generators/alchemy/menus/templates/node.html.slim +1 -1
  261. data/lib/generators/alchemy/menus/templates/wrapper.html.erb +1 -1
  262. data/lib/generators/alchemy/menus/templates/wrapper.html.haml +1 -1
  263. data/lib/generators/alchemy/menus/templates/wrapper.html.slim +1 -1
  264. data/lib/tasks/alchemy/tidy.rake +12 -0
  265. data/lib/tasks/alchemy/upgrade.rake +21 -15
  266. data/package/admin.js +8 -4
  267. data/package/src/file_editors.js +28 -0
  268. data/package/src/image_cropper.js +103 -0
  269. data/package/src/image_loader.js +58 -0
  270. data/package/src/node_tree.js +8 -8
  271. data/package/src/picture_editors.js +169 -0
  272. data/package/src/utils/__tests__/ajax.spec.js +16 -52
  273. data/package/src/utils/ajax.js +0 -12
  274. data/package.json +3 -2
  275. data/vendor/assets/javascripts/jquery_plugins/jquery.Jcrop.min.js +3 -18
  276. data/vendor/assets/javascripts/jquery_plugins/jquery.ui.nestedSortable.js +434 -0
  277. data/vendor/assets/stylesheets/jquery.Jcrop.min.scss +2 -28
  278. metadata +291 -53
  279. data/.rspec +0 -1
  280. data/app/assets/javascripts/alchemy/alchemy.image_cropper.js.coffee +0 -44
  281. data/app/assets/javascripts/alchemy/alchemy.trash_window.js.coffee +0 -30
  282. data/app/assets/javascripts/alchemy/templates/page_folder.hbs +0 -3
  283. data/app/assets/stylesheets/alchemy/trash.scss +0 -8
  284. data/app/controllers/alchemy/admin/trash_controller.rb +0 -44
  285. data/app/views/alchemy/admin/essence_files/assign.js.erb +0 -3
  286. data/app/views/alchemy/admin/essence_pictures/assign.js.erb +0 -4
  287. data/app/views/alchemy/admin/essence_pictures/crop.html.erb +0 -48
  288. data/app/views/alchemy/admin/trash/clear.js.erb +0 -4
  289. data/app/views/alchemy/admin/trash/index.html.erb +0 -31
  290. data/lib/alchemy/error_tracking/airbrake_handler.rb +0 -13
  291. data/lib/alchemy/error_tracking.rb +0 -14
  292. data/lib/alchemy/test_support/factories.rb +0 -20
  293. data/package/src/page_publication_fields.js +0 -27
  294. data/package/src/page_sorter.js +0 -62
  295. data/package/src/sitemap.js +0 -148
@@ -0,0 +1,103 @@
1
+ export default class ImageCropper {
2
+ constructor(
3
+ minSize,
4
+ defaultBox,
5
+ aspectRatio,
6
+ trueSize,
7
+ formFieldIds,
8
+ elementId
9
+ ) {
10
+ this.initialized = false
11
+
12
+ this.minSize = minSize
13
+ this.defaultBox = defaultBox
14
+ this.aspectRatio = aspectRatio
15
+ this.trueSize = trueSize
16
+ this.cropFromField = document.getElementById(formFieldIds[0])
17
+ this.cropSizeField = document.getElementById(formFieldIds[1])
18
+ this.elementId = elementId
19
+ this.dialog = Alchemy.currentDialog()
20
+ this.dialog.options.closed = this.destroy
21
+
22
+ this.init()
23
+ this.bind()
24
+ }
25
+
26
+ get jcropOptions() {
27
+ return {
28
+ onSelect: this.update.bind(this),
29
+ setSelect: this.box,
30
+ aspectRatio: this.aspectRatio,
31
+ minSize: this.minSize,
32
+ boxWidth: 800,
33
+ boxHeight: 600,
34
+ trueSize: this.trueSize,
35
+ closed: this.destroy.bind(this)
36
+ }
37
+ }
38
+
39
+ get cropFrom() {
40
+ if (this.cropFromField.value) {
41
+ return this.cropFromField.value.split("x").map((v) => parseInt(v))
42
+ }
43
+ }
44
+
45
+ get cropSize() {
46
+ if (this.cropSizeField.value) {
47
+ return this.cropSizeField.value.split("x").map((v) => parseInt(v))
48
+ }
49
+ }
50
+
51
+ get box() {
52
+ if (this.cropFrom && this.cropSize) {
53
+ return [
54
+ this.cropFrom[0],
55
+ this.cropFrom[1],
56
+ this.cropFrom[0] + this.cropSize[0],
57
+ this.cropFrom[1] + this.cropSize[1]
58
+ ]
59
+ } else {
60
+ return this.defaultBox
61
+ }
62
+ }
63
+
64
+ init() {
65
+ if (!this.initialized) {
66
+ this.api = $.Jcrop("#imageToCrop", this.jcropOptions)
67
+ this.initialized = true
68
+ }
69
+ }
70
+
71
+ update(coords) {
72
+ this.cropFromField.value = Math.round(coords.x) + "x" + Math.round(coords.y)
73
+ this.cropFromField.dispatchEvent(new Event("change"))
74
+ this.cropSizeField.value = Math.round(coords.w) + "x" + Math.round(coords.h)
75
+ this.cropFromField.dispatchEvent(new Event("change"))
76
+ }
77
+
78
+ reset() {
79
+ this.api.setSelect(this.defaultBox)
80
+ this.cropFromField.value = `${this.box[0]}x${this.box[1]}`
81
+ this.cropSizeField.value = `${this.box[2]}x${this.box[3] - this.box[1]}`
82
+ }
83
+
84
+ destroy() {
85
+ if (this.api) {
86
+ this.api.destroy()
87
+ }
88
+ this.initialized = false
89
+ return true
90
+ }
91
+
92
+ bind() {
93
+ this.dialog.dialog_body.find('button[type="submit"]').click(() => {
94
+ Alchemy.setElementDirty(`[data-element-id='${this.elementId}']`)
95
+ this.dialog.close()
96
+ return false
97
+ })
98
+ this.dialog.dialog_body.find('button[type="reset"]').click(() => {
99
+ this.reset()
100
+ return false
101
+ })
102
+ }
103
+ }
@@ -0,0 +1,58 @@
1
+ // Shows spinner while loading images and
2
+ // fades the image after its been loaded
3
+
4
+ const DEFAULT_SPINNER_OPTIONS = { fill: "#fff" }
5
+
6
+ export default class ImageLoader {
7
+ static init(scope = document, spinnerOptions = DEFAULT_SPINNER_OPTIONS) {
8
+ if (typeof scope === "string") {
9
+ scope = document.querySelector(scope)
10
+ }
11
+ scope.querySelectorAll("img").forEach((image) => {
12
+ const loader = new ImageLoader(image, spinnerOptions)
13
+ loader.load()
14
+ })
15
+ }
16
+
17
+ constructor(image, spinnerOptions = DEFAULT_SPINNER_OPTIONS) {
18
+ this.image = image
19
+ this.parent = image.parentNode
20
+ this.spinner = new Alchemy.Spinner("small", spinnerOptions)
21
+ this.bind()
22
+ }
23
+
24
+ bind() {
25
+ this.image.addEventListener("load", this.onLoaded.bind(this))
26
+ this.image.addEventListener("error", this.onError.bind(this))
27
+ }
28
+
29
+ load(force = false) {
30
+ if (!force && this.image.complete) return
31
+
32
+ this.image.classList.add("loading")
33
+ this.spinner.spin(this.image.parentElement)
34
+ }
35
+
36
+ onLoaded() {
37
+ this.removeSpinner()
38
+ this.image.classList.remove("loading")
39
+ this.unbind()
40
+ }
41
+
42
+ onError() {
43
+ this.removeSpinner()
44
+ this.parent.innerHtml = '<span class="icon warn"></span>'
45
+ this.unbind()
46
+ }
47
+
48
+ unbind() {
49
+ this.image.removeEventListener("load", this.onLoaded)
50
+ this.image.removeEventListener("error", this.onError)
51
+ }
52
+
53
+ removeSpinner() {
54
+ this.parent.querySelectorAll(".spinner").forEach((spinner) => {
55
+ spinner.remove()
56
+ })
57
+ }
58
+ }
@@ -1,12 +1,12 @@
1
1
  import Sortable from "sortablejs"
2
- import { patch } from "./utils/ajax"
2
+ import ajax from "./utils/ajax"
3
3
  import { on } from "./utils/events"
4
4
 
5
5
  function displayNodeFolders() {
6
6
  document.querySelectorAll("li.menu-item").forEach((el) => {
7
7
  const leftIconArea = el.querySelector(".nodes_tree-left_images")
8
8
  const list = el.querySelector(".children")
9
- const node = { folded: el.dataset.folded === "true", id: el.dataset.id }
9
+ const node = { folded: el.dataset.folded === "true", id: el.dataset.id, type: el.dataset.type }
10
10
 
11
11
  if (list.children.length > 0 || node.folded) {
12
12
  leftIconArea.innerHTML = HandlebarsTemplates.node_folder({ node: node })
@@ -17,13 +17,13 @@ function displayNodeFolders() {
17
17
  }
18
18
 
19
19
  function onFinishDragging(evt) {
20
- const url = Alchemy.routes.move_api_node_path(evt.item.dataset.id)
20
+ const url = Alchemy.routes[evt.item.dataset.type].move_api_path(evt.item.dataset.id)
21
21
  const data = {
22
- target_parent_id: evt.to.dataset.nodeId,
22
+ target_parent_id: evt.to.dataset.recordId,
23
23
  new_position: evt.newIndex
24
24
  }
25
25
 
26
- patch(url, data)
26
+ ajax("PATCH", url, data)
27
27
  .then(() => {
28
28
  const message = Alchemy.t("Successfully moved menu item")
29
29
  Alchemy.growl(message)
@@ -36,12 +36,12 @@ function onFinishDragging(evt) {
36
36
 
37
37
  function handleNodeFolders() {
38
38
  on("click", ".nodes_tree", ".node_folder", function () {
39
- const nodeId = this.dataset.nodeId
39
+ const nodeId = this.dataset.recordId
40
40
  const menu_item = this.closest("li.menu-item")
41
- const url = Alchemy.routes.toggle_folded_api_node_path(nodeId)
41
+ const url = Alchemy.routes[this.dataset.recordType].toggle_folded_api_path(nodeId)
42
42
  const list = menu_item.querySelector(".children")
43
43
 
44
- patch(url)
44
+ ajax("PATCH", url)
45
45
  .then(() => {
46
46
  list.classList.toggle("folded")
47
47
  menu_item.dataset.folded =
@@ -0,0 +1,169 @@
1
+ import debounce from "lodash/debounce"
2
+ import max from "lodash/max"
3
+ import ajax from "./utils/ajax"
4
+ import ImageLoader from "./image_loader"
5
+
6
+ const UPDATE_DELAY = 125
7
+ const IMAGE_PLACEHOLDER = '<i class="icon far fa-image fa-fw"></i>'
8
+ const EMPTY_IMAGE = '<img src="" class="img_paddingtop" />'
9
+ const THUMBNAIL_SIZE = "160x120"
10
+
11
+ class PictureEditor {
12
+ constructor(container) {
13
+ this.container = container
14
+ this.cropFromField = container.querySelector("[data-crop-from]")
15
+ this.cropSizeField = container.querySelector("[data-crop-size]")
16
+ this.pictureIdField = container.querySelector("[data-picture-id]")
17
+ this.targetSizeField = container.querySelector("[data-target-size]")
18
+ this.imageCropperField = container.querySelector("[data-image-cropper]")
19
+ this.image = container.querySelector("img")
20
+ this.thumbnailBackground = container.querySelector(".thumbnail_background")
21
+ this.deleteButton = container.querySelector(".picture_tool.delete")
22
+ this.cropLink = container.querySelector(".crop_link")
23
+
24
+ this.targetSize = this.targetSizeField.dataset.targetSize
25
+ this.pictureId = this.pictureIdField.value
26
+
27
+ if (this.image) {
28
+ this.imageLoader = new ImageLoader(this.image)
29
+ }
30
+
31
+ this.update = debounce(() => {
32
+ this.updateImage()
33
+ this.updateCropLink()
34
+ }, UPDATE_DELAY)
35
+
36
+ this.deleteButton.addEventListener("click", this.removeImage.bind(this))
37
+ }
38
+
39
+ observe() {
40
+ const observer = new MutationObserver(this.mutationCallback.bind(this))
41
+
42
+ observer.observe(this.cropFromField, { attributes: true })
43
+ observer.observe(this.cropSizeField, { attributes: true })
44
+ observer.observe(this.pictureIdField, { attributes: true })
45
+ }
46
+
47
+ mutationCallback(mutationsList) {
48
+ for (const mutation of mutationsList) {
49
+ if ("pictureId" in mutation.target.dataset) {
50
+ this.cropFromField.value = ""
51
+ this.cropSizeField.value = ""
52
+ this.pictureId = mutation.target.value
53
+ }
54
+ this.update()
55
+ }
56
+ }
57
+
58
+ updateImage() {
59
+ if (!this.pictureId) return
60
+
61
+ this.ensureImage()
62
+ this.image.removeAttribute("alt")
63
+ this.image.removeAttribute("src")
64
+ this.imageLoader.load(true)
65
+ ajax("GET", `/admin/pictures/${this.pictureId}/url`, {
66
+ crop: this.imageCropperEnabled,
67
+ crop_from: this.cropFrom,
68
+ crop_size: this.cropSize,
69
+ flatten: true,
70
+ size: THUMBNAIL_SIZE
71
+ })
72
+ .then(({ data }) => {
73
+ this.image.src = data.url
74
+ this.image.alt = data.alt
75
+ this.image.title = data.title
76
+ })
77
+ .catch((error) => {
78
+ console.error(error.message || error)
79
+ Alchemy.growl(error.message || error, "error")
80
+ })
81
+ }
82
+
83
+ ensureImage() {
84
+ if (this.image) return
85
+
86
+ this.thumbnailBackground.innerHTML = EMPTY_IMAGE
87
+ this.image = this.container.querySelector("img")
88
+ this.imageLoader = new ImageLoader(this.image)
89
+ }
90
+
91
+ removeImage() {
92
+ this.thumbnailBackground.innerHTML = IMAGE_PLACEHOLDER
93
+ this.pictureIdField.value = ""
94
+ this.image = null
95
+ this.cropLink.classList.add("disabled")
96
+ Alchemy.setElementDirty(this.container.closest(".element-editor"))
97
+ }
98
+
99
+ updateCropLink() {
100
+ if (!this.pictureId || !this.imageCropperEnabled) return
101
+
102
+ this.cropLink.classList.remove("disabled")
103
+
104
+ if (this.cropLink.href.match(/(picture_id=)\d+/)) {
105
+ this.cropLink.href = this.cropLink.href.replace(
106
+ /(picture_id=)\d+/,
107
+ "$1" + this.pictureId
108
+ )
109
+ } else {
110
+ this.cropLink.href = this.cropLink.href + `&picture_id=${this.pictureId}`
111
+ }
112
+ }
113
+
114
+ get cropFrom() {
115
+ if (this.cropFromField.value === "") {
116
+ return this.defaultCropFrom.join("x")
117
+ }
118
+ return this.cropFromField.value
119
+ }
120
+
121
+ get cropSize() {
122
+ if (this.cropSizeField.value === "") {
123
+ return this.defaultCropSize.join("x")
124
+ }
125
+ return this.cropSizeField.value
126
+ }
127
+
128
+ get defaultCropSize() {
129
+ if (!this.imageCropperEnabled) return []
130
+
131
+ const mask = this.targetSize.split("x").map((n) => parseInt(n))
132
+ const zoom = max([
133
+ mask[0] / this.imageFileWidth,
134
+ mask[1] / this.imageFileHeight
135
+ ])
136
+
137
+ return [Math.round(mask[0] / zoom), Math.round(mask[1] / zoom)]
138
+ }
139
+
140
+ get defaultCropFrom() {
141
+ if (!this.imageCropperEnabled) return []
142
+
143
+ const dimensions = this.defaultCropSize
144
+
145
+ return [
146
+ Math.round((this.imageFileWidth - dimensions[0]) / 2),
147
+ Math.round((this.imageFileHeight - dimensions[1]) / 2)
148
+ ]
149
+ }
150
+
151
+ get imageFileWidth() {
152
+ return parseInt(this.pictureIdField.dataset.imageFileWidth)
153
+ }
154
+
155
+ get imageFileHeight() {
156
+ return parseInt(this.pictureIdField.dataset.imageFileHeight)
157
+ }
158
+
159
+ get imageCropperEnabled() {
160
+ return this.targetSizeField.dataset.imageCropper === "true"
161
+ }
162
+ }
163
+
164
+ export default function init(selector) {
165
+ document.querySelectorAll(selector).forEach((node) => {
166
+ const thumbnail = new PictureEditor(node)
167
+ thumbnail.observe()
168
+ })
169
+ }
@@ -1,5 +1,5 @@
1
1
  import xhrMock from "xhr-mock"
2
- import { get, patch, post } from "../ajax"
2
+ import ajax from "../ajax"
3
3
 
4
4
  const token = "s3cr3t"
5
5
 
@@ -8,13 +8,13 @@ beforeEach(() => {
8
8
  xhrMock.setup()
9
9
  })
10
10
 
11
- describe("get", () => {
11
+ describe("ajax('get')", () => {
12
12
  it("sends X-CSRF-TOKEN header", async () => {
13
13
  xhrMock.get("http://localhost/users", (req, res) => {
14
14
  expect(req.header("X-CSRF-TOKEN")).toEqual(token)
15
15
  return res.status(200).body('{"message":"Ok"}')
16
16
  })
17
- await get("/users")
17
+ await ajax("get", "/users")
18
18
  })
19
19
 
20
20
  it("sends Content-Type header", async () => {
@@ -24,7 +24,7 @@ describe("get", () => {
24
24
  )
25
25
  return res.status(200).body('{"message":"Ok"}')
26
26
  })
27
- await get("/users")
27
+ await ajax("get", "/users")
28
28
  })
29
29
 
30
30
  it("sends Accept header", async () => {
@@ -32,14 +32,14 @@ describe("get", () => {
32
32
  expect(req.header("Accept")).toEqual("application/json")
33
33
  return res.status(200).body('{"message":"Ok"}')
34
34
  })
35
- await get("/users")
35
+ await ajax("get", "/users")
36
36
  })
37
37
 
38
38
  it("returns JSON", async () => {
39
39
  xhrMock.get("http://localhost/users", (_req, res) => {
40
40
  return res.status(200).body('{"email":"mail@example.com"}')
41
41
  })
42
- await get("/users").then((res) => {
42
+ await ajax("get", "/users").then((res) => {
43
43
  expect(res.data).toEqual({ email: "mail@example.com" })
44
44
  })
45
45
  })
@@ -49,7 +49,7 @@ describe("get", () => {
49
49
  return res.status(200).body('email => "mail@example.com"')
50
50
  })
51
51
  expect.assertions(1)
52
- await get("/users").catch((e) => {
52
+ await ajax("get", "/users").catch((e) => {
53
53
  expect(e.message).toMatch("Unexpected token")
54
54
  })
55
55
  })
@@ -59,7 +59,7 @@ describe("get", () => {
59
59
  return Promise.reject(new Error())
60
60
  })
61
61
  expect.assertions(1)
62
- await get("/users").catch((e) => {
62
+ await ajax("get", "/users").catch((e) => {
63
63
  expect(e.message).toEqual("An error occurred during the transaction")
64
64
  })
65
65
  })
@@ -69,7 +69,7 @@ describe("get", () => {
69
69
  return res.status(401).body('{"error":"Unauthorized"}')
70
70
  })
71
71
  expect.assertions(1)
72
- await get("/users").catch((e) => {
72
+ await ajax("get", "/users").catch((e) => {
73
73
  expect(e.error).toEqual("Unauthorized")
74
74
  })
75
75
  })
@@ -79,7 +79,7 @@ describe("get", () => {
79
79
  return res.status(401).body("Unauthorized")
80
80
  })
81
81
  expect.assertions(1)
82
- await get("/users").catch((e) => {
82
+ await ajax("get", "/users").catch((e) => {
83
83
  expect(e.message).toMatch("Unexpected token")
84
84
  })
85
85
  })
@@ -88,54 +88,18 @@ describe("get", () => {
88
88
  xhrMock.get("http://localhost/users?name=foo", (_req, res) => {
89
89
  return res.status(200).body(`{"name":"foo"}`)
90
90
  })
91
- const { data } = await get("/users", { name: "foo" })
91
+ const { data } = await ajax("get", "/users", { name: "foo" })
92
92
  expect(data.name).toEqual("foo")
93
93
  })
94
94
  })
95
95
 
96
- describe("patch", () => {
97
- it("sends X-CSRF-TOKEN header", async () => {
98
- xhrMock.patch("http://localhost/users", (req, res) => {
99
- expect(req.header("X-CSRF-TOKEN")).toEqual(token)
100
- return res.status(200).body('{"message":"Ok"}')
101
- })
102
- await patch("/users")
103
- })
104
-
105
- it("sends Content-Type header", async () => {
106
- xhrMock.patch("http://localhost/users", (req, res) => {
107
- expect(req.header("Content-Type")).toEqual(
108
- "application/json; charset=utf-8"
109
- )
110
- return res.status(200).body('{"message":"Ok"}')
111
- })
112
- await patch("/users")
113
- })
114
-
115
- it("sends Accept header", async () => {
116
- xhrMock.patch("http://localhost/users", (req, res) => {
117
- expect(req.header("Accept")).toEqual("application/json")
118
- return res.status(200).body('{"message":"Ok"}')
119
- })
120
- await patch("/users")
121
- })
122
-
123
- it("sends JSON data", async () => {
124
- xhrMock.patch("http://localhost/users", (req, res) => {
125
- expect(req.body()).toEqual('{"email":"mail@example.com"}')
126
- return res.status(200).body('{"message":"Ok"}')
127
- })
128
- await patch("/users", { email: "mail@example.com" })
129
- })
130
- })
131
-
132
- describe("post", () => {
96
+ describe("ajax('post')", () => {
133
97
  it("sends X-CSRF-TOKEN header", async () => {
134
98
  xhrMock.post("http://localhost/users", (req, res) => {
135
99
  expect(req.header("X-CSRF-TOKEN")).toEqual(token)
136
100
  return res.status(200).body('{"message":"Ok"}')
137
101
  })
138
- await post("/users")
102
+ await ajax("post", "/users")
139
103
  })
140
104
 
141
105
  it("sends Content-Type header", async () => {
@@ -145,7 +109,7 @@ describe("post", () => {
145
109
  )
146
110
  return res.status(200).body('{"message":"Ok"}')
147
111
  })
148
- await post("/users")
112
+ await ajax("post", "/users")
149
113
  })
150
114
 
151
115
  it("sends Accept header", async () => {
@@ -153,7 +117,7 @@ describe("post", () => {
153
117
  expect(req.header("Accept")).toEqual("application/json")
154
118
  return res.status(200).body('{"message":"Ok"}')
155
119
  })
156
- await post("/users")
120
+ await ajax("post", "/users")
157
121
  })
158
122
 
159
123
  it("sends JSON data", async () => {
@@ -161,7 +125,7 @@ describe("post", () => {
161
125
  expect(req.body()).toEqual('{"email":"mail@example.com"}')
162
126
  return res.status(200).body('{"message":"Ok"}')
163
127
  })
164
- await post("/users", { email: "mail@example.com" })
128
+ await ajax("post", "/users", { email: "mail@example.com" })
165
129
  })
166
130
  })
167
131
 
@@ -29,18 +29,6 @@ function getToken() {
29
29
  return metaTag.attributes.content.textContent
30
30
  }
31
31
 
32
- export function get(url, params) {
33
- return ajax("GET", url, params)
34
- }
35
-
36
- export function patch(url, data) {
37
- return ajax("PATCH", url, data)
38
- }
39
-
40
- export function post(url, data) {
41
- return ajax("POST", url, data)
42
- }
43
-
44
32
  export default function ajax(method, path, data) {
45
33
  const xhr = new XMLHttpRequest()
46
34
  const promise = buildPromise(xhr)
data/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alchemy_cms/admin",
3
- "version": "5.3.4",
3
+ "version": "0.2.0",
4
4
  "description": "AlchemyCMS",
5
5
  "browser": "package/admin.js",
6
6
  "files": [
@@ -24,12 +24,13 @@
24
24
  },
25
25
  "homepage": "https://github.com/AlchemyCMS/alchemy_cms#readme",
26
26
  "dependencies": {
27
+ "lodash-es": "^4.17.21",
27
28
  "sortablejs": "^1.10.2"
28
29
  },
29
30
  "devDependencies": {
30
31
  "@babel/core": "^7.9.6",
31
32
  "@babel/preset-env": "^7.9.6",
32
- "babel-jest": "^26.0.1",
33
+ "babel-jest": "^27.0.1",
33
34
  "jest": "^25.2.7",
34
35
  "prettier": "^2.0.2",
35
36
  "xhr-mock": "^2.5.1"