atome 0.5.4.1.7 → 0.5.5.6.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (358) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +4 -1
  3. data/Gemfile +3 -1
  4. data/README.md +70 -1
  5. data/Rakefile +246 -75
  6. data/app_builder_helpers/Rakefile +276 -288
  7. data/documentation/basic.md +242 -0
  8. data/documentation/deep learning/architecture.txt +3763 -0
  9. data/documentation/deep learning/atome.png +0 -0
  10. data/documentation/deep learning/basic_infos.txt +227 -0
  11. data/documentation/deep learning/example_of_users_code.rb +1810 -0
  12. data/documentation/deep learning/misc.txt +24 -0
  13. data/documentation/deep learning/ruby_js_example.rb +272 -0
  14. data/documentation/deep learning/wasm_script_help.text +14 -0
  15. data/documentation/framework/enhance_atome.md +1 -1
  16. data/documentation/tutorials/tutorials.md +7 -0
  17. data/exe/atome +308 -208
  18. data/lib/atome/atome.rb +52 -156
  19. data/lib/atome/extensions/atome.rb +129 -47
  20. data/lib/atome/extensions/mathematics.rb +20 -0
  21. data/lib/atome/extensions/ping.rb +2 -3
  22. data/lib/atome/genesis/generators/atome.rb +57 -30
  23. data/lib/atome/genesis/generators/communication.rb +9 -0
  24. data/lib/atome/genesis/generators/effect.rb +0 -1
  25. data/lib/atome/genesis/generators/event.rb +279 -43
  26. data/lib/atome/genesis/generators/geometry.rb +1 -10
  27. data/lib/atome/genesis/generators/hierarchy.rb +103 -0
  28. data/lib/atome/genesis/generators/identity.rb +45 -84
  29. data/lib/atome/genesis/generators/material.rb +31 -34
  30. data/lib/atome/genesis/generators/property.rb +31 -0
  31. data/lib/atome/genesis/generators/security.rb +31 -0
  32. data/lib/atome/genesis/generators/spatial.rb +3 -5
  33. data/lib/atome/genesis/generators/time.rb +0 -1
  34. data/lib/atome/genesis/generators/utility.rb +181 -66
  35. data/lib/atome/genesis/genesis.rb +152 -55
  36. data/lib/atome/genesis/sparkle.rb +59 -75
  37. data/lib/atome/helpers/color_helper/color/rgb/colors.rb +1 -1
  38. data/lib/atome/helpers/color_helper/color/rgb.rb +1 -1
  39. data/lib/atome/helpers/color_helper/color.rb +226 -7
  40. data/lib/atome/helpers/essentials.rb +22 -26
  41. data/lib/atome/helpers/security.rb +71 -0
  42. data/lib/atome/helpers/utilities.rb +191 -178
  43. data/lib/atome/kernel/black_matter.rb +22 -0
  44. data/lib/atome/kernel/universe.rb +123 -24
  45. data/lib/atome/presets/atome.rb +39 -35
  46. data/lib/atome/version.rb +3 -2
  47. data/lib/atome.rb +12 -12
  48. data/lib/atome_relative.rb +36 -0
  49. data/lib/{atome/renderers → platform_specific}/opal/atome_opal_extensions.rb +4 -1
  50. data/lib/{atome/renderers → platform_specific}/opal/extensions/color.rb +12 -5
  51. data/lib/{atome/renderers → platform_specific}/opal/extensions/geolocation.rb +1 -0
  52. data/lib/platform_specific/opal/extensions/js.rb +21 -0
  53. data/lib/platform_specific/opal/extensions/object.rb +6 -0
  54. data/lib/platform_specific/opal/extensions/ping.rb +31 -0
  55. data/lib/{atome/renderers → platform_specific}/opal/extensions/sha.rb +4 -2
  56. data/lib/platform_specific/wasm/atome_wasm_extensions.rb +11 -0
  57. data/lib/renderers/headless/headless.rb +18 -0
  58. data/lib/renderers/headless/index.rb +6 -0
  59. data/lib/renderers/headless/index_relative.rb +6 -0
  60. data/lib/renderers/headless/utility.rb +6 -0
  61. data/{vendor/assets/src/medias/rubies/examples/top.rb → lib/renderers/html/atome.rb} +0 -1
  62. data/lib/renderers/html/atome_html.rb +22 -0
  63. data/lib/renderers/html/effect.rb +26 -0
  64. data/lib/renderers/html/event.rb +43 -0
  65. data/lib/renderers/html/geometry.rb +31 -0
  66. data/lib/renderers/html/hierarchy.rb +233 -0
  67. data/lib/renderers/html/html.rb +1112 -0
  68. data/lib/renderers/html/identity.rb +84 -0
  69. data/lib/renderers/html/index.rb +19 -0
  70. data/lib/renderers/html/index_relative.rb +20 -0
  71. data/lib/renderers/html/material.rb +53 -0
  72. data/lib/renderers/html/property.rb +24 -0
  73. data/lib/renderers/html/spatial.rb +46 -0
  74. data/lib/renderers/html/time.rb +1 -0
  75. data/lib/renderers/html/utility.rb +38 -0
  76. data/lib/renderers/renderer.rb +16 -0
  77. data/lib/renderers/server/index.rb +4 -0
  78. data/lib/renderers/server/index_relative.rb +4 -0
  79. data/lib/renderers/server/utility.rb +4 -0
  80. data/sig/atome.rbs +6 -0
  81. data/sig/object.rbs +4 -0
  82. data/sig/universe.rbs +3 -0
  83. data/vendor/assets/Rakefile +3 -3
  84. data/vendor/assets/application/examples/a_concat.rb +16 -0
  85. data/vendor/assets/application/examples/affect.rb +8 -0
  86. data/vendor/assets/application/examples/animation.rb +96 -0
  87. data/vendor/assets/application/examples/apply.rb +8 -0
  88. data/vendor/assets/application/examples/atome.rb +5 -0
  89. data/vendor/assets/application/examples/attach.rb +34 -0
  90. data/vendor/assets/application/examples/attached.rb +38 -0
  91. data/vendor/assets/application/examples/basic_understanding.rb +52 -0
  92. data/vendor/assets/application/examples/browse.rb +17 -0
  93. data/vendor/assets/application/examples/callback.rb +20 -0
  94. data/vendor/assets/application/examples/category.rb +12 -0
  95. data/vendor/assets/application/examples/clear.rb +96 -0
  96. data/vendor/assets/application/examples/clones.rb +177 -0
  97. data/vendor/assets/application/examples/code.rb +13 -0
  98. data/vendor/assets/application/examples/color.rb +54 -0
  99. data/vendor/assets/application/examples/convert.rb +163 -0
  100. data/vendor/assets/application/examples/copy.rb +25 -0
  101. data/vendor/assets/application/examples/copybck.rb +68 -0
  102. data/vendor/assets/application/examples/debug.rb +78 -0
  103. data/vendor/assets/application/examples/delete.rb +93 -0
  104. data/vendor/assets/application/examples/display.rb +279 -0
  105. data/vendor/assets/application/examples/display_bck.rb +164 -0
  106. data/vendor/assets/application/examples/drag.rb +45 -0
  107. data/vendor/assets/application/examples/drop.rb +35 -0
  108. data/vendor/assets/application/examples/duplicate.rb +64 -0
  109. data/vendor/assets/application/examples/edit.rb +21 -0
  110. data/vendor/assets/application/examples/encode.rb +6 -0
  111. data/vendor/assets/application/examples/file.rb +50 -0
  112. data/vendor/assets/application/examples/find.rb +157 -0
  113. data/vendor/assets/application/examples/generator_and_build.rb +15 -0
  114. data/vendor/assets/application/examples/getter.rb +16 -0
  115. data/vendor/assets/application/examples/grab.rb +14 -0
  116. data/vendor/assets/application/examples/gradient.rb +35 -0
  117. data/vendor/assets/application/examples/group.rb +44 -0
  118. data/vendor/assets/application/examples/hierarchy.rb +21 -0
  119. data/vendor/assets/application/examples/history.rb +31 -0
  120. data/vendor/assets/application/examples/hypertext.rb +113 -0
  121. data/vendor/assets/application/examples/image.rb +5 -0
  122. data/vendor/assets/application/examples/keyboard.rb +59 -0
  123. data/vendor/assets/application/examples/layout.rb +227 -0
  124. data/vendor/assets/application/examples/login.rb +10 -0
  125. data/vendor/assets/application/examples/markup.rb +4 -0
  126. data/vendor/assets/application/examples/match.rb +115 -0
  127. data/vendor/assets/application/examples/messaging.rb +16 -0
  128. data/vendor/assets/application/examples/monitor.rb +14 -0
  129. data/vendor/assets/application/examples/on_resize.rb +7 -0
  130. data/vendor/assets/{src/medias/rubies/examples/get_renderer_list.rb → application/examples/online.rb} +1 -1
  131. data/vendor/assets/application/examples/over.rb +29 -0
  132. data/vendor/assets/application/examples/paint.rb +23 -0
  133. data/vendor/assets/application/examples/particles.rb +4 -0
  134. data/vendor/assets/application/examples/percent_to_px.rb +4 -0
  135. data/vendor/assets/application/examples/play.rb +50 -0
  136. data/vendor/assets/application/examples/presets.rb +33 -0
  137. data/vendor/assets/application/examples/random.rb +42 -0
  138. data/vendor/assets/application/examples/raw_html.rb +48 -0
  139. data/vendor/assets/application/examples/read.rb +11 -0
  140. data/vendor/assets/application/examples/refresh.rb +62 -0
  141. data/vendor/assets/application/examples/remove.rb +47 -0
  142. data/vendor/assets/application/examples/repeat.rb +26 -0
  143. data/vendor/assets/application/examples/resize.rb +17 -0
  144. data/vendor/assets/application/examples/scroll.rb +11 -0
  145. data/vendor/assets/application/examples/security.rb +76 -0
  146. data/vendor/assets/application/examples/selected.rb +30 -0
  147. data/vendor/assets/application/examples/shadow.rb +46 -0
  148. data/vendor/assets/application/examples/shapes.rb +6 -0
  149. data/vendor/assets/{src/medias/rubies → application}/examples/smooth.rb +5 -1
  150. data/vendor/assets/application/examples/style.rb +4 -0
  151. data/vendor/assets/application/examples/sync.rb +39 -0
  152. data/vendor/assets/application/examples/tagged.rb +24 -0
  153. data/vendor/assets/application/examples/terminal.rb +4 -0
  154. data/vendor/assets/application/examples/text.rb +5 -0
  155. data/vendor/assets/application/examples/touch.rb +38 -0
  156. data/vendor/assets/application/examples/type_mutation.rb +18 -0
  157. data/vendor/assets/application/examples/universe.rb +8 -0
  158. data/vendor/assets/application/examples/vector.rb +24 -0
  159. data/vendor/assets/application/examples/video.rb +14 -0
  160. data/vendor/assets/application/examples/wait.rb +6 -0
  161. data/vendor/assets/application/examples/www.rb +10 -0
  162. data/vendor/assets/application/index.rb +1 -1
  163. data/vendor/assets/application/test.rb +29 -0
  164. data/vendor/assets/application/works/photos.rb +672 -0
  165. data/vendor/assets/application/works/photos2.rb +218 -0
  166. data/vendor/assets/application/works/photos3.rb +343 -0
  167. data/vendor/assets/application/works/photos4.rb +34 -0
  168. data/vendor/assets/application/works/photos6.rb +6 -0
  169. data/vendor/assets/application/works/trigga.rb +0 -0
  170. data/vendor/assets/application/works/vie.rb +74 -0
  171. data/vendor/assets/server/atome_server.rb +37 -41
  172. data/vendor/assets/server/atome_server_wasm.rb +112 -0
  173. data/vendor/assets/server/capture.rb +10 -0
  174. data/vendor/assets/server/config.ru +5 -4
  175. data/vendor/assets/src/css/style.css +29 -4
  176. data/vendor/assets/src/index.html +31 -38
  177. data/vendor/assets/src/index_opal.html +42 -0
  178. data/vendor/assets/src/index_server.html +43 -0
  179. data/vendor/assets/src/index_server_wasm.html +46 -0
  180. data/vendor/assets/src/js/atome/atome.js +170 -150
  181. data/vendor/assets/src/js/atome/atome_helpers/add_font.js +46 -0
  182. data/vendor/assets/src/js/atome/atome_helpers/atome_drag.js +3 -1
  183. data/vendor/assets/src/js/atome/atome_helpers/atome_events.js +12 -7
  184. data/vendor/assets/src/js/atome/atome_helpers/communication.js +126 -0
  185. data/vendor/assets/src/js/atome/atome_helpers/{atome_file.js → file.js} +1 -1
  186. data/vendor/assets/src/js/atome/specific/opal.js +3 -0
  187. data/vendor/assets/src/js/atome/specific/wasm.js +12 -0
  188. data/vendor/assets/src/js/third_parties/browser.script.iife.min.js +13 -0
  189. data/vendor/assets/src/js/third_parties/fabric.min.js +1 -1
  190. data/vendor/assets/src/js/third_parties/html-to-image.min.js +2 -0
  191. data/vendor/assets/src/js/third_parties/jsencrypt.min.js +2 -0
  192. data/vendor/assets/src/js/third_parties/papaparse.min.js +7 -0
  193. data/vendor/assets/src/medias/fonts/Roboto/LICENSE.txt +202 -0
  194. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Black.ttf +0 -0
  195. data/vendor/assets/src/medias/fonts/Roboto/Roboto-BlackItalic.ttf +0 -0
  196. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Bold.ttf +0 -0
  197. data/vendor/assets/src/medias/fonts/Roboto/Roboto-BoldItalic.ttf +0 -0
  198. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Italic.ttf +0 -0
  199. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Light.ttf +0 -0
  200. data/vendor/assets/src/medias/fonts/Roboto/Roboto-LightItalic.ttf +0 -0
  201. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Medium.ttf +0 -0
  202. data/vendor/assets/src/medias/fonts/Roboto/Roboto-MediumItalic.ttf +0 -0
  203. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Regular.ttf +0 -0
  204. data/vendor/assets/src/medias/fonts/Roboto/Roboto-Thin.ttf +0 -0
  205. data/vendor/assets/src/medias/fonts/Roboto/Roboto-ThinItalic.ttf +0 -0
  206. data/vendor/assets/src/medias/images/logos/Facebook.svg +1 -1
  207. data/vendor/assets/src/medias/images/logos/LinkedIn-full.svg +109 -0
  208. data/vendor/assets/src/medias/images/logos/LinkedIn.svg +11 -0
  209. data/vendor/assets/src/medias/images/logos/X.svg +5 -0
  210. data/vendor/assets/src-tauri/Cargo.toml +1 -1
  211. data/vendor/assets/src-tauri/src/main.rs +59 -5
  212. data/vendor/assets/src-tauri/tauri.conf.json +1 -1
  213. data/vendor/assets/src-wasm/wasm/wasi-vfs-osx_arm +0 -0
  214. data/vendor/assets/src-wasm/wasm/wasi-vfs-osx_x86 +0 -0
  215. data/vendor/assets/src-wasm/wasm/wasi-vfs-unix +0 -0
  216. data/vendor/assets/src-wasm/wasm/wasi-vfs.exe +0 -0
  217. metadata +188 -180
  218. data/lib/atome/extensions/mathematic.rb +0 -20
  219. data/lib/atome/extensions/matrix.rb +0 -346
  220. data/lib/atome/helpers/callbacks.rb +0 -133
  221. data/lib/atome/kernel/batch.rb +0 -26
  222. data/lib/atome/kernel/essentials.rb +0 -23
  223. data/lib/atome/renderers/browser/atome.rb +0 -158
  224. data/lib/atome/renderers/browser/browser.rb +0 -47
  225. data/lib/atome/renderers/browser/effect.rb +0 -23
  226. data/lib/atome/renderers/browser/event.rb +0 -96
  227. data/lib/atome/renderers/browser/geometry.rb +0 -27
  228. data/lib/atome/renderers/browser/helpers/animation_helper.rb +0 -69
  229. data/lib/atome/renderers/browser/helpers/browser_helper.rb +0 -101
  230. data/lib/atome/renderers/browser/helpers/color_helper.rb +0 -80
  231. data/lib/atome/renderers/browser/helpers/drag_helper.rb +0 -52
  232. data/lib/atome/renderers/browser/helpers/drop_helper.rb +0 -13
  233. data/lib/atome/renderers/browser/helpers/effect_helper.rb +0 -23
  234. data/lib/atome/renderers/browser/helpers/event_helper.rb +0 -76
  235. data/lib/atome/renderers/browser/helpers/image_helper.rb +0 -27
  236. data/lib/atome/renderers/browser/helpers/over_helper.rb +0 -13
  237. data/lib/atome/renderers/browser/helpers/shadow_helper.rb +0 -74
  238. data/lib/atome/renderers/browser/helpers/shape_helper.rb +0 -22
  239. data/lib/atome/renderers/browser/helpers/text_helper.rb +0 -38
  240. data/lib/atome/renderers/browser/helpers/video_helper.rb +0 -50
  241. data/lib/atome/renderers/browser/helpers/web_helper.rb +0 -26
  242. data/lib/atome/renderers/browser/identity.rb +0 -61
  243. data/lib/atome/renderers/browser/material.rb +0 -121
  244. data/lib/atome/renderers/browser/opal_add_on.rb +0 -31
  245. data/lib/atome/renderers/browser/opal_browser.rb +0 -6
  246. data/lib/atome/renderers/browser/spatial.rb +0 -59
  247. data/lib/atome/renderers/browser/time.rb +0 -3
  248. data/lib/atome/renderers/browser/utility.rb +0 -49
  249. data/lib/atome/renderers/headless/headless.rb +0 -10
  250. data/lib/atome/renderers/headless/utility.rb +0 -6
  251. data/lib/atome/renderers/html/atome.rb +0 -49
  252. data/lib/atome/renderers/html/effect.rb +0 -19
  253. data/lib/atome/renderers/html/event.rb +0 -9
  254. data/lib/atome/renderers/html/geometry.rb +0 -11
  255. data/lib/atome/renderers/html/html.rb +0 -42
  256. data/lib/atome/renderers/html/identity.rb +0 -14
  257. data/lib/atome/renderers/html/opal_browser.rb +0 -6
  258. data/lib/atome/renderers/html/spatial.rb +0 -28
  259. data/lib/atome/renderers/html/utility.rb +0 -17
  260. data/lib/atome/renderers/opal/extensions/atome.rb +0 -29
  261. data/lib/atome/renderers/opal/extensions/ping.rb +0 -18
  262. data/lib/atome/renderers/renderer.rb +0 -15
  263. data/lib/atome/renderers/server/server.rb +0 -10
  264. data/lib/atome/renderers/server/utility.rb +0 -6
  265. data/vendor/assets/aui.rb +0 -5
  266. data/vendor/assets/r&d/misc.rb +0 -219
  267. data/vendor/assets/r&d/ping.rb +0 -3
  268. data/vendor/assets/r&d/storage.rb +0 -9
  269. data/vendor/assets/r&d/view_example.rb +0 -21
  270. data/vendor/assets/src/js/atome/atome_helpers/atome_communication.js +0 -40
  271. data/vendor/assets/src/medias/javascripts/test.js +0 -1
  272. data/vendor/assets/src/medias/rubies/demos.rb +0 -63
  273. data/vendor/assets/src/medias/rubies/examples/add.rb +0 -24
  274. data/vendor/assets/src/medias/rubies/examples/animation.rb +0 -81
  275. data/vendor/assets/src/medias/rubies/examples/atome_new.rb +0 -27
  276. data/vendor/assets/src/medias/rubies/examples/attach.rb +0 -15
  277. data/vendor/assets/src/medias/rubies/examples/attached.rb +0 -15
  278. data/vendor/assets/src/medias/rubies/examples/auto_height.rb +0 -5
  279. data/vendor/assets/src/medias/rubies/examples/auto_width.rb +0 -4
  280. data/vendor/assets/src/medias/rubies/examples/batch.rb +0 -17
  281. data/vendor/assets/src/medias/rubies/examples/blur.rb +0 -4
  282. data/vendor/assets/src/medias/rubies/examples/bottom.rb +0 -3
  283. data/vendor/assets/src/medias/rubies/examples/box.rb +0 -20
  284. data/vendor/assets/src/medias/rubies/examples/center.rb +0 -21
  285. data/vendor/assets/src/medias/rubies/examples/circle.rb +0 -3
  286. data/vendor/assets/src/medias/rubies/examples/class.rb +0 -13
  287. data/vendor/assets/src/medias/rubies/examples/clear.rb +0 -10
  288. data/vendor/assets/src/medias/rubies/examples/clone.rb +0 -35
  289. data/vendor/assets/src/medias/rubies/examples/code.rb +0 -11
  290. data/vendor/assets/src/medias/rubies/examples/color.rb +0 -73
  291. data/vendor/assets/src/medias/rubies/examples/create_atome_in_atome.rb +0 -13
  292. data/vendor/assets/src/medias/rubies/examples/cursor.rb +0 -7
  293. data/vendor/assets/src/medias/rubies/examples/delete.rb +0 -42
  294. data/vendor/assets/src/medias/rubies/examples/depth.rb +0 -6
  295. data/vendor/assets/src/medias/rubies/examples/detached.rb +0 -13
  296. data/vendor/assets/src/medias/rubies/examples/drag.rb +0 -98
  297. data/vendor/assets/src/medias/rubies/examples/drop.rb +0 -26
  298. data/vendor/assets/src/medias/rubies/examples/edit.rb +0 -12
  299. data/vendor/assets/src/medias/rubies/examples/element.rb +0 -6
  300. data/vendor/assets/src/medias/rubies/examples/empty_atome.rb +0 -12
  301. data/vendor/assets/src/medias/rubies/examples/fullscreen.rb +0 -15
  302. data/vendor/assets/src/medias/rubies/examples/grab.rb +0 -5
  303. data/vendor/assets/src/medias/rubies/examples/height.rb +0 -7
  304. data/vendor/assets/src/medias/rubies/examples/hide.rb +0 -7
  305. data/vendor/assets/src/medias/rubies/examples/id.rb +0 -14
  306. data/vendor/assets/src/medias/rubies/examples/image.rb +0 -8
  307. data/vendor/assets/src/medias/rubies/examples/left.rb +0 -7
  308. data/vendor/assets/src/medias/rubies/examples/link.rb +0 -22
  309. data/vendor/assets/src/medias/rubies/examples/markers.rb +0 -48
  310. data/vendor/assets/src/medias/rubies/examples/materials.rb +0 -15
  311. data/vendor/assets/src/medias/rubies/examples/matrix.rb +0 -102
  312. data/vendor/assets/src/medias/rubies/examples/matrix_changes.rb +0 -483
  313. data/vendor/assets/src/medias/rubies/examples/matrix_simple.rb +0 -32
  314. data/vendor/assets/src/medias/rubies/examples/monitoring.rb +0 -70
  315. data/vendor/assets/src/medias/rubies/examples/mute.rb +0 -22
  316. data/vendor/assets/src/medias/rubies/examples/on.rb +0 -26
  317. data/vendor/assets/src/medias/rubies/examples/opacity.rb +0 -5
  318. data/vendor/assets/src/medias/rubies/examples/over.rb +0 -21
  319. data/vendor/assets/src/medias/rubies/examples/pause.rb +0 -15
  320. data/vendor/assets/src/medias/rubies/examples/physical.rb +0 -19
  321. data/vendor/assets/src/medias/rubies/examples/play.rb +0 -15
  322. data/vendor/assets/src/medias/rubies/examples/read.rb +0 -11
  323. data/vendor/assets/src/medias/rubies/examples/refresh.rb +0 -8
  324. data/vendor/assets/src/medias/rubies/examples/remove.rb +0 -16
  325. data/vendor/assets/src/medias/rubies/examples/repeat.rb +0 -6
  326. data/vendor/assets/src/medias/rubies/examples/right.rb +0 -3
  327. data/vendor/assets/src/medias/rubies/examples/rotate.rb +0 -4
  328. data/vendor/assets/src/medias/rubies/examples/schedule.rb +0 -13
  329. data/vendor/assets/src/medias/rubies/examples/shadow.rb +0 -84
  330. data/vendor/assets/src/medias/rubies/examples/size.rb +0 -8
  331. data/vendor/assets/src/medias/rubies/examples/sort.rb +0 -18
  332. data/vendor/assets/src/medias/rubies/examples/style.rb +0 -4
  333. data/vendor/assets/src/medias/rubies/examples/tags.rb +0 -10
  334. data/vendor/assets/src/medias/rubies/examples/text.rb +0 -39
  335. data/vendor/assets/src/medias/rubies/examples/time.rb +0 -18
  336. data/vendor/assets/src/medias/rubies/examples/to_px.rb +0 -10
  337. data/vendor/assets/src/medias/rubies/examples/touch.rb +0 -56
  338. data/vendor/assets/src/medias/rubies/examples/vector.rb +0 -39
  339. data/vendor/assets/src/medias/rubies/examples/video.rb +0 -65
  340. data/vendor/assets/src/medias/rubies/examples/wait.rb +0 -8
  341. data/vendor/assets/src/medias/rubies/examples/web.rb +0 -13
  342. data/vendor/assets/src/medias/rubies/examples/width.rb +0 -6
  343. data/vendor/assets/src/medias/rubies/test.rb +0 -1
  344. data/vendor/assets/src/medias/rubies/text_read.rb +0 -1
  345. data/vendor/assets/src/medias/rubies/unstable/!run.rb +0 -16
  346. data/vendor/assets/src/medias/rubies/unstable/_2_solve.rb +0 -72
  347. data/vendor/assets/src/medias/rubies/unstable/_attach.rb +0 -12
  348. data/vendor/assets/src/medias/rubies/unstable/_audio.rb +0 -231
  349. data/vendor/assets/src/medias/rubies/unstable/_dataset.rb +0 -257
  350. data/vendor/assets/src/medias/rubies/unstable/_matrix.rb +0 -58
  351. data/vendor/assets/src/medias/rubies/unstable/_os.rb +0 -29
  352. data/vendor/assets/src/medias/rubies/unstable/_table2.rb +0 -108
  353. data/vendor/assets/src/medias/rubies/unstable/_vie.rb +0 -211
  354. data/vendor/assets/src/medias/rubies/users/code.rb +0 -6
  355. /data/lib/{atome/renderers → platform_specific}/opal/opal.rb +0 -0
  356. /data/lib/{atome/renderers → platform_specific}/opal/opal_parser.rb +0 -0
  357. /data/{vendor/assets/src/utilities/mode.rb → lib/renderers/html/communication.rb} +0 -0
  358. /data/{vendor/assets/src/medias/rubies/unstable/_test.rb → lib/renderers/html/security.rb} +0 -0
@@ -0,0 +1,1810 @@
1
+ # animation example
2
+
3
+ b=box({id: :the_box})
4
+
5
+ b.animate(true)
6
+
7
+
8
+ Atome.new( { renderers: [:html], attach: [:view],id: :my_test_box, type: :shape, apply: [:shape_color],
9
+ left: 120, top: 0, width: 100, smooth: 15, height: 100, overflow: :visible, attached: [], center: true
10
+ })
11
+
12
+
13
+ # Here is the attach explanation and example
14
+ # the attach method in atome is both a getter and a setter
15
+ # attach and attached particles serve the same purpose but just in the opposite direction
16
+ # please note that atome.attach([:atome_id]) means that atome will be the parent of the atome with the id :atome_id
17
+ # to sum up : attach and attached are both setter and getter :
18
+ # attach will attach the current object to the IDs passed in the params. The current atome will be the child of the the atomes width IDS passed in the the params,
19
+ # while attached is the opposite to attached it will attach IDs passed in the params to the current atome. The current atome will be the parent of of the the atomes width IDS passed in the the params
20
+
21
+ # atome.attach([:atome_id]) means that atome will be the child of the atome with the id :atome_id
22
+ # Here is how to use it as a setter :
23
+ b = box({ id: :b315, color: :red })
24
+ circle({ id: :c_12, top: 0, drag: true, color: :yellow })
25
+
26
+
27
+ c=circle({ id: :c_123, color: :cyan, left: 233, drag: true })
28
+ box({ id: :b_1, left: 333, drag: true })
29
+ grab(:b_1).attach([:c_123])
30
+
31
+ bb = box({ top: 99, drag: true })
32
+ bb.attach([:b_1])
33
+
34
+
35
+ box({ id: :my_test_box })
36
+ wait 1 do
37
+ b.attach([:c_12])
38
+ # Here is how to use it as a getter :
39
+ # to retrieve witch atomes b315 is attached to to the atome c_12 just type
40
+ puts b.attach # => [:c_12]
41
+ # to retrieve atome attached to the atome c_12 just type tha other method
42
+ puts c.attached #=> [:b_1]
43
+ end
44
+
45
+ # Here is the attached explanation and example :
46
+
47
+ # the attached method in atome is both a getter and a setter
48
+ # attach and attached particles serve the same purpose but just in the opposite direction
49
+ # please note that atome.attach([:atome_id]) means that atome will be the parent of the atome with the id :atome_id
50
+ # to sum up : attach and attached are both setter and getter :
51
+ # attach will attach the current object to the IDs passed in the params. The current atome will be the child of the the atomes width IDS passed in the the params,
52
+ # while attached is the opposite to attached it will attach IDs passed in the params to the current atome. The current atome will be the parent of of the the atomes width IDS passed in the the params
53
+
54
+
55
+ # Here is how to use it as a setter :
56
+ grab(:black_matter).color({ red: 1, green: 0.6, blue: 0.6, id: :active_color })
57
+ grab(:black_matter).color({ red: 0.3, green: 1, blue: 0.3, id: :inactive_color })
58
+
59
+ b = box({ left: 99, drag: true, id: :the_box })
60
+ wait 1 do
61
+ b.apply([:active_color])
62
+ end
63
+ c = circle({ left: 333, id: :the_circle })
64
+ wait 2 do
65
+ c.apply(:inactive_color)
66
+ b.attached([c.id])
67
+
68
+ # Here is how to use it as a getter :
69
+ # to retrieve witch atomes b315 is attached to to the atome c_12 just type
70
+ puts c.attach # => [:the_box]
71
+ # to retrieve atome attached to the atome c_12 just type tha other method
72
+ puts b.attached #=> [:the_circle]
73
+ end
74
+
75
+
76
+
77
+ # The class Universe is used to retrieve some data needed for the atome framework
78
+ # per example you can retrieve the list of all available particles
79
+ puts Universe.particle_list
80
+ # this give at the date 14/11/2023 :
81
+ # or the list of all available atomes
82
+ puts Universe.atomes
83
+ # this give at the date 14/11/2023 :
84
+ # as well as the list of renderer available
85
+ puts Universe.renderer_list
86
+ # this give at the date 14/11/2023 :
87
+
88
+ # Universe hold all these instance variable :
89
+
90
+ # @counter is a integer that store the total number of atome actually active for the current user on the current machine
91
+ # @atomes = is a hash that contains a list all atomes actually active for the current user on the current machine,
92
+ # the key is the atome ID the value is the atome object itself
93
+ # atomes_specificities
94
+ # @atome_list is a hash that contains all atome's types available
95
+ # @particle_list is a hash that contains all particle's types available
96
+ # @renderer_list is an array that contains all renderers available
97
+ # @specificities indicate to the atome framework witch atomes or particles have specificities, as all atomes and particles methods are define using lot of meta-programming, some atome and particle need special treatment, then we use specificities
98
+ # @specificities is a hash where the key is either the atome type or the particle type and the value is a proc that hold the code to be executed when the specified atome is instantiated or the particle is applied onto the atome
99
+ # @sanitizers is a hash where the key is either the atome type or the particle type and the value is a proc holding the code to sanitize user input value before it's the value is interpreted , rendered and stored
100
+ # @history is a hash that store the history of all modification of any atome's particle that happen on the current machine for current user.
101
+ # the history hash is define as follow: the key is number of the operation ( 0 is the first modification, 1 the second , and so on... )
102
+ # that value of the history hash contain also another hash define as follow: the key is the id of the atome altered and the value is again a new hash with three keys :
103
+ # on of the three keys is sync , the sync value hold the sync state of the alteration (sync true means that the alteration is stored and backup on a server), another keys is time, its value hold the time stamp of the alteration
104
+ # the third key is the particle altered and value is the new value of the particle
105
+ # @users = is a hash that contains all user session on the current machine
106
+
107
+ # basic usage:
108
+ # # we create a basic empty atome
109
+ a=Atome.new
110
+ # we add a bunch particles
111
+ a.renderers([:html])
112
+ a.id(:my_shape)
113
+ a.type(:shape)
114
+ a.width(33)
115
+ a.height(33)
116
+ a.top(33)
117
+ a.left(33)
118
+ # we can now add a color the atome using apply used to apply an atome onto another (please note that color is also an atome not a particle)
119
+ # in this case we apply the color atome name box_color this a default color created by the system
120
+ a.apply([:box_color])
121
+ wait 2 do
122
+ # a bit less efficient and a bit more processor intensive solution is to use the box preset, that render a box too
123
+ b=box
124
+ # we can add a color atome onto the new atome my_shape. as stated before for some atome types such as color, shadows ,the relation between the two atomes won't be attach and attached but apply and affect instead the atome color with the particle red onto the
125
+ b.color(:red)
126
+ end
127
+
128
+
129
+
130
+ # browse only works with application version of atome or using server mode , it allow the browse local file on your computer or remote file on server, if operating in server mode
131
+
132
+ # here is an example :
133
+ A.browse('/') do |data|
134
+ text "folder content :\n #{data}"
135
+ end
136
+
137
+
138
+
139
+ # here is how callbock is used with atome
140
+ test_box = box({left: -20})
141
+
142
+ test_box.blur(9) do |params_back|
143
+ puts "here is the callback : #{params_back}"
144
+ end
145
+ # per example it's possible to set back params like this
146
+ test_box.callback({ blur: 'I am the callback content!!' })
147
+ # now we call the callback for blur
148
+ test_box.call(:blur)
149
+
150
+ circle({id: :the_c})
151
+ # here is a callback with event params
152
+ test_box.drag(true) do |event|
153
+ grab(:the_c).left(150+event[:pageX].to_i)
154
+ end
155
+
156
+
157
+
158
+ # here is how to clear the content of an atome
159
+ b=box
160
+ c=circle
161
+ b.left(0)
162
+ c.left(222)
163
+ wait 2 do
164
+ # Important : please note that the view is also an atome, this this a system atome that can't be deleted,
165
+ # There are a few system atomes created at init time
166
+ # Here are the list of the system atomes created at system startup:
167
+ # we can clear it's content using .clear(true) its the same action as if I have done : b.delete(true) and c.delete(true)
168
+ grab(:view).clear(true)
169
+ end
170
+
171
+
172
+ # here are the list of system atomes created at system startup :
173
+
174
+
175
+ #Atome.new(
176
+ # { renderers: [], id: :eDen, type: :element, tag: { system: true }, attach: [], attached: [] }
177
+ # )
178
+ # Atome.new(
179
+ # { renderers: [], id: :user_view, type: :element, tag: { system: true },
180
+ # attach: [:eDen], attached: [] }
181
+ # )
182
+ #
183
+ # # color creation
184
+ # Atome.new(
185
+ # { renderers: default_render, id: :view_color, type: :color, tag: ({ system: true, persistent: true }),
186
+ # red: 0.15, green: 0.15, blue: 0.15, alpha: 1, top: 12, left: 12, diffusion: :linear, attach: [], attached: [] }
187
+ # )
188
+ #
189
+ # Atome.new(
190
+ # { renderers: default_render, id: :shape_color, type: :color, tag: ({ system: true, persistent: true }),
191
+ # red: 0.4, green: 0.4, blue: 0.4, alpha: 1, attach: [], attached: [] }
192
+ # )
193
+ #
194
+ # Atome.new(
195
+ # { renderers: default_render, id: :box_color, type: :color, tag: ({ system: true, persistent: true }),
196
+ # red: 0.5, green: 0.5, blue: 0.5, alpha: 1, attach: [], attached: [] }
197
+ # )
198
+ #
199
+ # Atome.new(
200
+ # { renderers: default_render, id: :invisible_color, type: :color, tag: ({ system: true, persistent: true }),
201
+ # red: 0, green: 0, blue: 0, alpha: 1, attach: [], attached: [] }
202
+ # )
203
+ #
204
+ # Atome.new(
205
+ # { renderers: default_render, id: :text_color, type: :color, tag: ({ system: true, persistent: true }),
206
+ # red: 0.9, green: 0.9, blue: 0.9, alpha: 1, attach: [], attached: [] }
207
+ # )
208
+ #
209
+ # Atome.new(
210
+ # { renderers: default_render, id: :circle_color, type: :color, tag: ({ system: true, persistent: true }),
211
+ # red: 0.6, green: 0.6, blue: 0.6, alpha: 1, attach: [], attached: [] }
212
+ # )
213
+ #
214
+ # # system object creation
215
+ # # the black_matter is used to store un materialized atomes
216
+ # Atome.new(
217
+ # { renderers: default_render, id: :black_matter, type: :shape, attach: [:user_view],apply: [],
218
+ # left: 0, right: 0, top: 0, bottom: 0, width: 0, height: 0, overflow: :hidden, tag: { system: true }, attached: []
219
+ # })
220
+ #
221
+ # # view port
222
+ # Atome.new(
223
+ # { renderers: default_render, id: :view, type: :shape, attach: [:user_view], apply: [:view_color],
224
+ # tag: { system: true },
225
+ # attached: [], left: 0, right: 0, top: 0, bottom: 0, width: :auto, height: :auto, overflow: :auto,
226
+ # }
227
+ #
228
+ # )
229
+ #
230
+ # # unreal port, hold system object and tools
231
+ # Atome.new(
232
+ # { renderers: default_render, id: :intuition, type: :shape, attach: [:user_view], tag: { system: true },
233
+ # left: 0, top: 0, width: 0, height: 0, overflow: :visible, attached: [],apply: []
234
+ # }
235
+ # )
236
+ #
237
+ # machine_id = :dummy_machine
238
+ # # attention we must used two separate pass to avoid the password to be encode twice
239
+ # machine_password = { read: {atome: :star_wars},write: {atome: :star_wars} }
240
+ # user_password = { read: {atome: :star_wars},write: {atome: :star_wars} }
241
+ #
242
+ # machine({ id: machine_id, password: machine_password, name: :macAir, data: { date: '10090717' }, tag: { system: true } })
243
+ #
244
+ # human({ id: :anonymous, login: true, password: user_password, data: { birthday: '10/05/1996' }, tag: { system: true } })
245
+ #
246
+ # # default_user.set_current_user(:anonymous)
247
+ # Universe.current_machine = machine_id
248
+ # # the constant A is used to access alla atomes methods
249
+ # A = Atome.new(
250
+ # { renderers: default_render, id: :atome, type: :element, tag: { system: true }, attach: [], attached: [] }
251
+ # )#
252
+ #
253
+ # # TODO : clones alteration must be bidirectional, to do so :
254
+ # # 1 - we may create an atome type 'clone' then add a ' pre_render_clones option' when rendering clones property
255
+ # # 2 - this pre_render_clones option, will catch alterations and throw it the the original atome
256
+ # # 3 - we also add a new particle call mirror that holds the particle's list that will reverse intrication
257
+ #
258
+ # b = box({ color: :red, smooth: 6, id: :the_box })
259
+ #
260
+ # b.clones([{ left: 300, top: 300, color: :blue, entangled: [:width, :attached, :height] },
261
+ # { left: 600, top: 366, color: :green, entangled: [:left, :height] }])
262
+ #
263
+ # wait 1 do
264
+ # b.width(190)
265
+ # end
266
+ #
267
+ # wait 2 do
268
+ # b.height(180)
269
+ # end
270
+ #
271
+ # wait 3 do
272
+ # b.left(180)
273
+ # end
274
+ #
275
+ # grab(:the_box_clone_0).smooth(33)
276
+ # #
277
+ # grab(:the_box_clone_1).rotate(33)
278
+ #
279
+ # wait 5 do
280
+ # b.clones.each do |clone_found|
281
+ # grab(clone_found[:id]).delete(true)
282
+ # end
283
+ # end
284
+ #
285
+
286
+
287
+ c = circle({ id: :the_circle, left: 12, top: 0, color: :orange, drag: { move: true, inertia: true, lock: :start } })
288
+ b = box({ top: 123 })
289
+
290
+ t = text({ data: :hello, left: 300 })
291
+
292
+ t.touch(true) do
293
+ alert "#{b.touch} , #{b.touch_code}"
294
+ b.touch_code[:touch].call
295
+ end
296
+ col = color({ id: :col1, red: 1, blue: 1 })
297
+
298
+ atomes_monitored = [c, b]
299
+ # particles_monitored=[:left, :width, :touch, :apply]
300
+ particles_monitored=[:left, :width, :apply]
301
+ # particles_monitored = [:touch]
302
+ Atome.monitoring(atomes_monitored, particles_monitored) do |monitor_infos|
303
+ puts "1 ==> #{@id} : #{monitor_infos[:particle]},#{monitor_infos[:altered]}"
304
+
305
+ atomes_monitored.each do |atome_to_update|
306
+ # we exclude the current changing atome to avoid infinite loop
307
+ unless atome_to_update == self || (monitor_infos[:original] == monitor_infos[:altered]) || !monitor_infos[:altered]
308
+ puts "2 ==> #{atome_to_update.id} : #{monitor_infos[:particle]},#{monitor_infos[:altered]}"
309
+ atome_to_update.send(monitor_infos[:particle], monitor_infos[:altered])
310
+ end
311
+
312
+ end
313
+ end
314
+
315
+ b.resize(true)
316
+ c.resize(true) do |l|
317
+
318
+ puts c.instance_variable_get("@resize_code")
319
+ end
320
+ ccc = color(:red)
321
+ wait 1 do
322
+ # b.left(133)
323
+ b.touch(true) do
324
+ alert "b width is #{b.width}"
325
+ end
326
+
327
+ c.left(133)
328
+ wait 1 do
329
+ # c.color(:red)
330
+ # c.apply([ccc.id])
331
+ b.width(155)
332
+ end
333
+ end
334
+
335
+ ############## add class solution
336
+ the_b=box({color: :green})
337
+
338
+ the_b.resize(true) do
339
+ puts :j
340
+ end
341
+ class HTML
342
+
343
+ def id(id)
344
+ @element[:classList].add(id.to_s)
345
+ attr('id', id)
346
+ self
347
+ end
348
+ def add_class(val)
349
+ @element[:classList].add(val.to_s)
350
+ # @element.setAttribute('id', val)
351
+ end
352
+
353
+ def force_top(id,value)
354
+ element=JS.global[:document].getElementById(id.to_s)
355
+ element[:style][:top] ='33px'
356
+ end
357
+ end
358
+
359
+ new({ particle: :add_class }) do |params|
360
+ html.add_class(params)
361
+ end
362
+
363
+ new({ particle: :force_top }) do |params|
364
+ html.force_top(params)
365
+ end
366
+
367
+ b = box({ id: :toto })
368
+ bb = box({ id: :toto, left: 333 })
369
+ bb.add_class(:toto)
370
+ b.add_class(:toto)
371
+ bb.force_top(:toto,3)
372
+
373
+ new({ particle: :run }) do |params, code|
374
+ code_found = @code_code[:code]
375
+ instance_exec(params, &code_found) if code_found.is_a?(Proc)
376
+ end
377
+ a = box
378
+ a.code(:hello) do
379
+ circle({ left: 333 })
380
+ end
381
+ wait 1 do
382
+ a.run(:hello)
383
+ end
384
+
385
+
386
+ col=color({green: 1, id: :the_col})
387
+
388
+ b=box({top: 3})
389
+ t=text(data: :red, left: 0, top: 123)
390
+ t1=text(data: :green, left: 100, top: 123)
391
+ t2=text(data: :blue, left: 200, top: 123)
392
+ t3=text(data: :yellow, left: 300, top: 123)
393
+ t4=text(data: :orange, left: 400, top: 123)
394
+ t5=text(data: :cyan, left: 500, top: 123)
395
+
396
+ item_to_batch=[t.id,t1.id,t2.id, t3.id, t4.id, t5.id]
397
+ the_group= group({ collected: item_to_batch })
398
+ the_group.apply([:the_col])
399
+ t.touch(true) do
400
+ b.color({id: :red, red: 1 })
401
+ # puts "number of atomes : #{Universe.atomes.length}"
402
+ end
403
+ t1.touch(true) do
404
+ b.color({id: :green, green: 1 })
405
+ # puts "number of atomes : #{Universe.atomes.length}"
406
+ end
407
+ t2.touch(true) do
408
+ b.color({id: :blue, blue: 1 })
409
+ # puts "number of atomes : #{Universe.atomes.length}"
410
+ end
411
+ t3.touch(true) do
412
+ b.color({id: :yellow, red: 1, green: 1 })
413
+ # puts "number of atomes : #{Universe.atomes.length}"
414
+ end
415
+ t4.touch(true) do
416
+ b.color({id: :orange, red: 1, green: 0.5 })
417
+ # puts "number of atomes : #{Universe.atomes.length}"
418
+ end
419
+ t5.touch(true) do
420
+ b.color({id: :cyan, blue: 1, green: 1 })
421
+ # puts "number of atomes : #{Universe.atomes.length}"
422
+ end
423
+
424
+ t=text({data: "dynamic color propagation, touch me to propagate"})
425
+ t.apply(:the_col)
426
+ c=circle({id: :the_circle, top: 260})
427
+ c.apply([:the_col])
428
+ b.apply([:the_col])
429
+
430
+ t.touch(true) do
431
+ col.red(1)
432
+ end
433
+
434
+
435
+ b = box({ id: :the_html, color: :orange, overflow: :auto, width: :auto, height: :auto, left: 100, right: 100, top: 100, bottom: 100 })
436
+ html_desc = <<STR
437
+ <!DOCTYPE html>
438
+ <html>
439
+ <head>
440
+ <title>Une petite page HTML</title>
441
+ <meta charset="utf-8" />
442
+ </head>
443
+ <body>
444
+ <h1 id='title' style='color: yellowgreen'>Un titre de niveau 1</h1>
445
+
446
+ <p>
447
+ Un premier petit paragraphe.
448
+ </p>
449
+
450
+ <h2>Un titre de niveau 2</h2>
451
+
452
+ <p>
453
+ Un autre paragraphe contenant un lien pour aller
454
+ sur le site <a href="http://koor.fr">KooR.fr</a>.
455
+ </p>
456
+ </body>
457
+ </html>
458
+ STR
459
+
460
+ b.hypertext(html_desc)
461
+
462
+ def markup_analysis(markup) end
463
+
464
+ def convert(params)
465
+ case
466
+ when params.keys.include?(:atome)
467
+
468
+ # Atome.new({type})
469
+ puts params[:atome]
470
+ else
471
+ # ...
472
+ end
473
+ end
474
+
475
+ b.hyperedit(:title) do |tag_desc|
476
+ convert({ atome: tag_desc })
477
+ end
478
+
479
+
480
+ b=box
481
+ b.left(3)
482
+ b.right(3)
483
+ b.width(:auto)
484
+
485
+ b = box()
486
+ b.text('click me')
487
+
488
+ b.touch(true) do
489
+ c = grab(:view).circle({id: :circling, left: 222, color: :orange, blur: 6 })
490
+ c.box({id: :boxing,color: :orange, width: 33, height: 33, left: 123})
491
+ c.box({id: :boxy,color: :red, width: 33, height: 33, left: 333})
492
+ c.text('tap here')
493
+ wait 0.5 do
494
+ c.delete(:left)
495
+ wait 0.5 do
496
+ c.delete(:blur)
497
+ end
498
+ end
499
+
500
+ c.touch(true) do
501
+ c.delete({ recursive: true })
502
+ end
503
+ end
504
+
505
+
506
+ #############
507
+ new({ atome: :generator }) do |params|
508
+ # we remove build and store it in a temporary particle as it has to be added after atome creation
509
+ build = params.delete(:build)
510
+ params[:temporary] = { build: build }
511
+ end
512
+ new({ post: :generator }) do |params|
513
+ build_plans = params[:temporary][:build]
514
+ # alert build_plans
515
+ # grab(params[:id]).build(build_plans)
516
+ end
517
+
518
+ new ({ particle: :build, store: false }) do |params|
519
+ # we get the id or generate it for the new builder
520
+ if params[:id]
521
+ byild_id = params[:id]
522
+ else
523
+ byild_id = "auto_build_#{Universe.atomes.length}"
524
+ params[:id] = byild_id
525
+ end
526
+ # now we create a hash if it doesnt already exist
527
+ # if it exist we feed the hash
528
+ if build
529
+ build[byild_id] = params
530
+ else
531
+ #
532
+ build_hash = { byild_id => params }
533
+ store({ 'build': build_hash })
534
+ end
535
+ #
536
+ # now we'll created the wanted atomes
537
+ # here are the default params
538
+ default_styles = { type: :shape, renderers: [:html], width: 66, height: 66, color: :gray, left: 12, top: 12, copies: 0, attach: [:view] }
539
+ params = default_styles.merge(params)
540
+ color_found = color(params[:color])
541
+ left_pos = params[:left]
542
+ top_pos = params[:top]
543
+ atomes({}) unless atomes
544
+
545
+ params[:id] = identity_generator(params[:type]) unless params[:id]
546
+ atomes[params[:id]] = []
547
+
548
+ params[:copies].downto(0) do |index|
549
+ item_number = params[:copies] - index
550
+ bundle_id = if params[:id]
551
+ "#{params[:id]}_#{item_number}"
552
+ else
553
+ "#{params[:id]}_#{item_number}"
554
+ end
555
+ copied_items_params = params.dup
556
+ copied_items_params[:id] = bundle_id
557
+ # alert copied_items_params
558
+ copy = Atome.new(copied_items_params)
559
+ copy.attach(copied_items_params[:attach])
560
+ copy.apply([color_found.id])
561
+ copy.left(((copy.width + left_pos) * item_number) + left_pos)
562
+ copy.top(((copy.height + top_pos) * item_number) + top_pos)
563
+ atomes[params[:id]] << bundle_id
564
+ end
565
+ end
566
+
567
+
568
+ def duplicate(ids)
569
+ ids.each do |id_passed|
570
+
571
+ atome_passed=grab(id_passed)
572
+ # atome_passed.particles.delete(:left)
573
+ # we remove attached
574
+ particle_to_remove=[:id, :broadcast, :history,:callback, :html_object, :store_allow,:attached]
575
+ particles_found=atome_passed.particles.dup
576
+ particles_found.delete_if { |key, value| particle_to_remove.include?(key) }
577
+ particles_found[:id]=identity_generator(particles_found[:type])
578
+ collected_particles={}
579
+ particles_found.each do |particle_found, value_found|
580
+ collected_particles[particle_found]=value_found
581
+ end
582
+ ordered_keys = [:renderers, :id, :type, :attach]
583
+ ordered_particles = ordered_keys.map { |k| [k, collected_particles[k]] }.to_h
584
+
585
+ other_part = collected_particles.reject { |k, _| ordered_keys.include?(k) }
586
+ # merge the parts to obtain an re-ordered hash
587
+ ordered_particles = ordered_particles.merge(other_part)
588
+
589
+ # alert ordered_particles
590
+ nw_atome= Atome.new(ordered_particles)
591
+
592
+ wait 2 do
593
+ nw_atome.left(333)
594
+ end
595
+ end
596
+ end
597
+
598
+ b=box
599
+ c=b.circle
600
+ c.text(:hello)
601
+ b.touch(true) do
602
+ puts @id
603
+ end
604
+ b.clones([{ left: 300, top: 300, color: :blue, entangled: [:width, :attached, :height] },
605
+ { left: 600, top: 366, color: :green, entangled: [:left, :height] }])
606
+
607
+
608
+
609
+ gen = generator({ id: :genesis, build: {top: 66, copies: 1} })
610
+
611
+
612
+
613
+ new({ particle: :display, render: false }) do |params|
614
+ # alert type
615
+ unless params[:items]
616
+ params[:items] = { width: 200, height: 33 }
617
+ end
618
+ container_width = params[:width] ||= width
619
+ container_height = params[:heigth] ||= height
620
+ container_top = params[:top] ||= top
621
+ container_left = params[:left] ||= left
622
+
623
+ item_width = params[:items][:width] ||= 400
624
+ item_height = params[:items][:height] ||= 50
625
+ item_margin = params[:margin] ||= 3
626
+
627
+ mode = params[:mode]
628
+
629
+ case mode
630
+ when :none
631
+ when :custom
632
+ when :list
633
+ if params[:data].instance_of? Array
634
+ elsif params[:data] == :particles
635
+ list_id = "#{id}_list"
636
+ unless grab(list_id)
637
+ container = ''
638
+ attach.each do |parent|
639
+ container = grab(parent).box({ id: list_id, left: container_left, top: container_top, width: container_width, height: container_height, overflow: :auto, color: :black, depth: 0 })
640
+ container.on(:resize) do |event|
641
+ puts event[:dx]
642
+ end
643
+ container.resize({ min: { width: 100, height: 100 }, max: { width: 300, height: 700 } }) do |event|
644
+ puts event
645
+ end
646
+
647
+ end
648
+ sorted_particles = particles.sort.to_h
649
+ sorted_particles.each_with_index do |(particle_found, value), index|
650
+ line = container.box({ id: "#{list_id}_#{index}", width: item_width, height: item_height, left: 0, top: ((item_height + item_margin) * index) })
651
+ line.text({ data: "#{particle_found} : ", top: -item_height / 2, left: 2 })
652
+ if value.instance_of?(String) || value.instance_of?(Symbol) || value.instance_of?(Integer)
653
+ input_value = line.text({ data: value, top: -item_height / 2, left: 5, edit: true })
654
+ input_value.keyboard(:down) do |native_event|
655
+ event = Native(native_event)
656
+ if event[:keyCode].to_i == 13
657
+ event.preventDefault()
658
+ input_value.color(:red)
659
+ end
660
+ end
661
+ input_value.keyboard(:up) do |native_event|
662
+ data_found = input_value.data
663
+ send(particle_found, data_found)
664
+ end
665
+ else
666
+ puts "value is :#{value.class} => #{value}"
667
+ end
668
+ end
669
+ closer = container.circle({ id: "#{list_id}_closer", width: 33, height: 33, top: 3, right: 3, color: :red, position: :sticky })
670
+ closer.touch(true) do
671
+ container.delete(true)
672
+ end
673
+ end
674
+ else
675
+ end
676
+ when :grid
677
+ grid_id = "#{id}_grid"
678
+ unless grab(grid_id)
679
+ container = grab(:view).box({ id: grid_id, width: container_width, height: container_height, overflow: :auto, color: :white, depth: 0 })
680
+
681
+ container.touch(true) do
682
+ alert "removing container recursively : #{container.id}"
683
+ val_1= Universe.atomes.length
684
+ puts "val_1 : #{val_1}"
685
+ container.delete({ recursive: true })
686
+ val_2= Universe.atomes.length
687
+ puts "val_2 : #{val_2}"
688
+ puts "val_1-val_2 : #{val_1-val_2}"
689
+ end
690
+ ############## deletion
691
+ params[:data].each_with_index do |item, index|
692
+ item = container.box({ id: "#{grid_id}_#{index}", top: 0, position: :relative, left: nil, right: nil })
693
+ end
694
+ # container.html.style('gridTemplateColumns', '1fr 1fr 1fr 1fr 1fr 1fr')
695
+ container.html.style('gridTemplateColumns', 'repeat(4, 1fr)')
696
+ container.html.style('gridTemplateRows', 'auto')
697
+ container.html.style('gridGap', '10px')
698
+ container.html.style('display', 'grid')
699
+ container.on(:resize) do |event|
700
+ puts event[:dx]
701
+ end
702
+ container.resize({ min: { width: 10, height: 10 }, max: { width: 300, height: 700 } }) do |event|
703
+ puts event
704
+ end
705
+ end
706
+ end
707
+ end
708
+ new({ particle: :visible })
709
+ new({ renderer: :html, method: :visible }) do |params|
710
+ if params == false
711
+ params = :none
712
+ elsif params == true
713
+ params = :block
714
+ end
715
+ html.visible(params)
716
+ end
717
+ new({ particle: :position }) do
718
+ end
719
+ new({ method: :position, type: :integer, renderer: :html }) do |params|
720
+ html.style(:position, params)
721
+ end
722
+
723
+ b = box({ color: :red })
724
+
725
+ b.touch(true) do
726
+ # b.display({ mode: :list, data: :particles, width: 333, items: { width: 200, height: 33 }, height: 33, margin: 5 })
727
+ b.display({ mode: :list, data: :particles, items: { width: 200, height: 33 }, height: 33, margin: 5 })
728
+ end
729
+ ############## Builder #############
730
+ c = circle({ left: 333 })
731
+ fake_array = []
732
+ i = 0
733
+ while i < 32 do
734
+ fake_array << i
735
+ i += 1
736
+ end
737
+ c.touch(true) do
738
+ c.display({ mode: :grid, data: fake_array,width: 333, height: 333 })
739
+ end
740
+
741
+ ############## Generator #############
742
+ gen = generator({ id: :genesis, build: { top: 66, copies: 1 } })
743
+ gen.build({ id: :bundler, copies: 32, tag: { group: :to_grid }, color: :red, width: 33, height: 44, left: 123, smooth: 9, blur: 3, attach: [:view] })
744
+ grab(:bundler_1).color(:blue)
745
+
746
+ color({ id: :the_orange, red: 1, green: 0.4 })
747
+
748
+ atome_to_grid = tagged({ group: :to_grid })
749
+ the_group = group({ collected: atome_to_grid })
750
+
751
+ the_group.touch(true) do |i|
752
+ color(:green)
753
+ end
754
+ # wait 0.3 do
755
+ the_group.left(633)
756
+ wait 1 do
757
+ grab(:view).display({ mode: :grid, data: fake_array })
758
+ end
759
+
760
+
761
+
762
+
763
+
764
+ #
765
+ a=box({width: 666, height: 777, color: :orange})
766
+ b = box({ left: 666, color: :blue, smooth: 6, id: :the_box2, depth: 1 })
767
+ cc=circle({color: :red, left: 0, top: 0})
768
+ clone = ""
769
+ b.drag(:start) do
770
+ b.color(:black)
771
+ b.height(123)
772
+ # beware you must use grab(:view) else it'll be attached to the context, that means to 'b' in this case
773
+ clone = grab(:view).circle({ id: "#{b.id}_cloned",color: :white, left: b.left, top: b.top, depth: 3 })
774
+ end
775
+
776
+ b.drag(:stop) do
777
+ b.color(:purple)
778
+ b.height=b.height+100
779
+ clone.delete(true)
780
+ end
781
+
782
+
783
+
784
+ b.drag(:locked) do |event|
785
+ dx = event[:dx]
786
+ dy = event[:dy]
787
+ x = (clone.left || 0) + dx.to_f
788
+ y = (clone.top || 0) + dy.to_f
789
+ clone.left(x)
790
+ clone.top(y)
791
+ end
792
+ cc.drag({ restrict: {max:{ left: 240, top: 190}} }) do |event|
793
+
794
+ end
795
+
796
+
797
+ c=circle
798
+
799
+ c.drag({ restrict: a.id }) do |event|
800
+
801
+ end
802
+
803
+ t=text({data: 'touch me to unbind drag stop for b (clone will not deleted anymore)', left: 250 })
804
+ t.touch(true) do
805
+ b.drag({remove: :stop})
806
+ end#
807
+
808
+
809
+
810
+ dragged = box({ left: 33,top: 333, width: 333,color: :orange, smooth: 6, id: :drop_zone })
811
+
812
+ dragged.drop(true) do |event|
813
+ grab(event[:destination]).color(:white)
814
+ grab(event[:source]).color(:black)
815
+ end
816
+
817
+ dragged.drop(:enter) do |event|
818
+ grab(event[:destination]).color(:red)
819
+ end
820
+
821
+ dragged.drop(:leave) do |event|
822
+ grab(event[:destination]).color(:gray)
823
+ end
824
+
825
+ dragged.drop(:activate) do |event|
826
+ grab(event[:destination]).color(:yellow)
827
+ grab(event[:source]).color(:cyan)
828
+ end
829
+
830
+
831
+ dragged.drop(:deactivate) do |event|
832
+ grab(event[:destination]).color(:orange)
833
+ end
834
+ box({ left: 333, color: :blue,top: 222, smooth: 6, id: :the_box, drag: true })
835
+
836
+ t=text({data: 'touch me to unbind drop enter'})
837
+ t.touch(true) do
838
+ dragged.drop({ remove: :enter })
839
+ end
840
+
841
+ #
842
+
843
+ t = text :hello
844
+ t.left(99)
845
+
846
+ t.edit(true)
847
+
848
+ b=box
849
+ b.touch(true) do
850
+ puts t.data
851
+ end
852
+
853
+
854
+ my_pass = Black_matter.encode('hello')
855
+ puts my_pass
856
+ checker = Black_matter.check_password('hello,', my_pass)
857
+ puts checker
858
+
859
+ gen = generator({ id: :genesis, build: {top: 66, copies: 1} })
860
+ gen.build({ id: :bundler, copies: 32, color: :red, width: 33, height: 44, left: 123, smooth: 9, blur: 3, attach: [:view] })
861
+ grab(:bundler_1).color(:blue)
862
+
863
+
864
+ the_text = text({ data: 'hello for al the people in front of their machine jhgj jg jgh jhg iuuy res ', center: true, top: 120, width: 77, component: { size: 11 } })
865
+ the_box = box({ left: 12 })
866
+ the_circle = circle({ id: :cc, color: :orange })
867
+ the_circle.image('red_planet')
868
+ the_circle.color('red')
869
+ the_circle.box({ left: 333, id: :the_c })
870
+
871
+ element({ id: :the_element })
872
+ the_view = grab(:view)
873
+ puts "views_shape's shape are : #{the_view.shape}"
874
+ puts "the_circle color is : #{the_circle.color}"
875
+ puts "the_text data is : #{the_text.data}"
876
+ puts "the_box left is : #{the_box.left}"
877
+ puts "the_circle particles are : #{the_circle.particles}"
878
+ #
879
+
880
+ # the grab method is used to retrieve atome using their ID
881
+ a=box({id: :my_box})
882
+
883
+ # to alter or add a particle you can use the variable, here we set the left value
884
+ a.left(33)
885
+
886
+ # to alter or add a particle you can use the variable
887
+ # it's also possible to alter or add a particle without a variable using grab and the ID of the atome , here we set the top value
888
+ grab(:my_box).top(55)
889
+
890
+ circ = circle({ drag: true })
891
+ circ.remove({ all: :color })
892
+ col_1 = circ.color(:white)
893
+ col_2 = circ.color({ red: 1, id: :red_col })
894
+ col_4 = circ.color({ blue: 1, id: :red_col2, alpha: 0.3 })
895
+ col_5 = circ.color({ red: 0, green: 1, id: :red_col3, alpha: 0.7 })
896
+ col_3 = circ.color(:yellow)
897
+ wait 0.5 do
898
+ circ.paint({ gradient: [col_1.id, col_2.id], direction: :left })
899
+ wait 0.5 do
900
+ circ.paint({ id: :the_painter, rotate: 69, gradient: [col_1.id, col_2.id] })
901
+ wait 0.5 do
902
+ circ.color(:cyan)
903
+ circ.paint({ gradient: [col_1.id, col_2.id, col_3.id], rotate: 33, diffusion: :conic })
904
+ wait 0.5 do
905
+ painter = circ.paint({ id: :the_painter2, gradient: [col_1.id, col_2.id, col_3.id], direction: :left })
906
+ wait 0.5 do
907
+ circ.color(:blue)
908
+ circ.paint({ gradient: [col_4.id, col_5.id], diffusion: :conic })
909
+ end
910
+ end
911
+ end
912
+ end
913
+
914
+ end
915
+
916
+ the_text = text({ data: 'hello for al the people in front of their machine', center: true, top: 222, width: 777, component: { size: 66 } })
917
+
918
+ the_text.left(333)
919
+
920
+ the_text.paint({ gradient: [col_1.id, col_2.id], direction: :left , id: :painted_love })
921
+
922
+ # #TODO : gradient on text!
923
+
924
+
925
+ text({ id: :the_text,data: 'Touch me to group and colorize', center: true, top: 120, width: 77, component: { size: 11 } })
926
+ box({ left: 12, id: :the_first_box })
927
+ the_circle = circle({ id: :cc, color: :yellowgreen, top: 222 })
928
+ the_circle.image('red_planet')
929
+ the_circle.color('red')
930
+ the_circle.box({ left: 333, id: :the_c })
931
+
932
+ element({ id: :the_element })
933
+
934
+ the_view = grab(:view)
935
+
936
+ color({ id: :the_orange, red: 1, green: 0.4 })
937
+ color({ id: :the_lemon, red: 0, blue: 1 })
938
+
939
+ the_group = group({ collected: the_view.shape })
940
+
941
+
942
+ wait 0.5 do
943
+ the_group.left(633)
944
+ wait 0.5 do
945
+ the_group.rotate(23)
946
+ wait 0.5 do
947
+ the_group.apply([:the_orange])
948
+ the_group.blur(6)
949
+ end
950
+ end
951
+ end
952
+ puts the_group.collected
953
+ grab(:the_first_box).smooth(9)
954
+ grab(:the_text).touch(true) do
955
+ the_group2= group({ collected: [:the_c,:the_first_box, :the_text, :cc ] })
956
+ the_group2.apply([:the_lemon])
957
+ end
958
+
959
+
960
+ # grab(:the_text).touch(true) do
961
+ # FIXME : on touch code above crash but works with wait
962
+
963
+
964
+ # here is how to setup a hierarchy within atome using a more simple way than attached and attach .simply adding atome inside another atome. here is a example to do to so : b = box({ id: :the_box })
965
+ b=box
966
+ # the line below will create a circle inside the box b
967
+ c = b.circle({ id: :the_circle })
968
+ # we can add any atome inside another atome, below we add a text inside de th box b
969
+ t = b.text({ data: :hello, left: 200, id: :the_cirle })
970
+ # theres no limit in the depht of atome, we can create an image inside the text, exemple:
971
+ t.image({ path: 'medias/images/logos/atome.svg', width: 33 })
972
+
973
+ # note that creating a hierarchy this way automatically
974
+
975
+ # Note that when you create a hierarchy in this way, it automatically creates a relationship by populating the 'attach' and 'attached' properties. So, if you enter:
976
+
977
+
978
+ puts "b attach : #{b.attach}" # prints [:view] in the console as it is attached to the view atom
979
+ puts "b attached :#{b.attached}" # prints [:the_circle, :the_cirle] in the console
980
+
981
+ puts "c attach: #{c.attach}" # prints [:the_box] in the console
982
+ puts "c attached: #{c.attached}" # prints [:box_14] in the console as there's no child#
983
+
984
+ b = box({ id: :the_box })
985
+ b.data(:canyouwritethis)
986
+ b.rotate(33)
987
+ b.rotate(88)
988
+ b.rotate(99)
989
+ b.rotate(12)
990
+ b.rotate(6)
991
+ b.data
992
+ b.touch(true) do
993
+ b.data(:super)
994
+ b.data
995
+ box_data_write_history=b.history({ operation: :write, id: :the_box, particle: :data })
996
+ puts "get data write operation : #{box_data_write_history}"
997
+ box_data_read_history=b.history({ operation: :read, id: :the_box, particle: :data })
998
+ puts "get data read operation : #{box_data_read_history}"
999
+ end
1000
+
1001
+
1002
+ box_rotate_history=b.history({ operation: :write, id: :the_box, particle: :rotate })
1003
+ puts "get all all rotate write operation : #{box_rotate_history}"
1004
+
1005
+ # we check if an operation synced (that means saved on atome's server)
1006
+ puts "first rotate operation state : #{box_rotate_history[0]}"
1007
+
1008
+ box_data_history=b.history({ operation: :write, id: :the_box, particle: :data })
1009
+ puts "get data write operation : #{box_data_history}"
1010
+
1011
+
1012
+
1013
+ b = box({ id: :the_html, color: :orange, overflow: :auto, width: :auto, height: :auto, left: 100, right: 100, top: 100, bottom: 100 })
1014
+
1015
+ html_desc = <<STR
1016
+ <!DOCTYPE html>
1017
+ <html lang="fr">
1018
+ <head>
1019
+ <meta charset="UTF-8">
1020
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
1021
+ <title>Com 1 Image</title>
1022
+ <style>
1023
+ body { font-family: Arial, sans-serif; margin: 0; padding: 0; }
1024
+ header { display: flex; justify-content: space-between; align-items: center; padding: 20px; }
1025
+ nav { display: none; }
1026
+ .section { padding: 50px 20px; text-align: center;z-index: 3 }
1027
+ .contact-info { text-align: left; }
1028
+ @media (min-width: 768px) {
1029
+ nav { display: block; }
1030
+ }
1031
+ </style>
1032
+ <style>
1033
+ .ok-info { text-align: left; }
1034
+ @media (min-width: 768px) {
1035
+ nav { display: block; }
1036
+ }
1037
+ </style>
1038
+ </head>
1039
+ <body>
1040
+
1041
+ <header>
1042
+ <button>☰</button> <!-- Icône de menu pour mobile -->
1043
+ <h1>Com 1 Image</h1>
1044
+ <nav>
1045
+ <a href="#accueil">Accueil</a>
1046
+ </nav>
1047
+ </header>
1048
+
1049
+ <section id='title' class="section my_class" style='left: 333px;color: yellow'>
1050
+ <h2>PRODUCTIONS AUDIOVISUELLES</h2>
1051
+ <!-- Contenu de la section -->
1052
+ </section>
1053
+
1054
+ <section class="section">
1055
+ <h2>COLLABORATIF</h2>
1056
+ <p>Texte sur le collaboratif...</p>
1057
+ </section>
1058
+
1059
+ <section class="section">
1060
+ <h2>CORPORATE</h2>
1061
+ <div class="communication">
1062
+ <!-- Images et textes liés à la communication -->
1063
+ </div>
1064
+ <div class="publicite">
1065
+ <!-- Images et textes liés à la publicité -->
1066
+ </div>
1067
+ <!-- ... Autres contenus de la section Corporate -->
1068
+ </section>
1069
+
1070
+ <section class="section">
1071
+ <h2>ART</h2>
1072
+ <p>Texte sur l'art...</p>
1073
+ </section>
1074
+
1075
+ <section class="section contact-info">
1076
+ <h2>CONTACT</h2>
1077
+ <p>email@example.com</p>
1078
+ <address>
1079
+ 74 bis avenue des Thèmes<br>
1080
+ 63400 - Chamalières
1081
+ </address>
1082
+ </section>
1083
+
1084
+ </body>
1085
+ </html>
1086
+
1087
+ STR
1088
+ b.hypertext(html_desc)
1089
+
1090
+
1091
+ b.hyperedit(:title) do |tag_desc|
1092
+ puts tag_desc
1093
+ end
1094
+
1095
+ # TODO : create an html to atome converter
1096
+
1097
+ #
1098
+
1099
+ image(:red_planet)
1100
+
1101
+ image({path: 'medias/images/logos/atome.svg', width: 33})#
1102
+
1103
+ t = text :hello
1104
+ t.left(99)
1105
+
1106
+ t.edit(true)
1107
+
1108
+ t.keyboard(:press) do |native_event|
1109
+ event = Native(native_event)
1110
+ puts "press : #{event[:key]} : #{event[:keyCode]}"
1111
+ end
1112
+
1113
+ t.keyboard(:down) do |native_event|
1114
+ event = Native(native_event)
1115
+ if event[:keyCode].to_s == '13'
1116
+ event.preventDefault()
1117
+ t.color(:red)
1118
+ end
1119
+
1120
+ end
1121
+
1122
+ t.keyboard(:up) do |native_event|
1123
+ event = Native(native_event)
1124
+ puts "up!!"
1125
+ end
1126
+
1127
+ t.keyboard(true) do |native_event|
1128
+ event = Native(native_event)
1129
+ puts " true => #{event[:keyCode]}"
1130
+ puts "true => #{event[:key]}"
1131
+
1132
+ end
1133
+
1134
+
1135
+ c = circle({ top: 123, left: 0, width: 55, height: 55 })
1136
+ c2 = circle({ top: 123, left: 80, width: 55, height: 55 })
1137
+ c3 = circle({ top: 123, left: 150, width: 55, height: 55 })
1138
+
1139
+ c.touch(true) do
1140
+ text({ data: 'stop up', top: 150 })
1141
+ t.keyboard({ remove: :up })
1142
+ end
1143
+ c2.touch(true) do
1144
+ text({ data: 'remove all', top: 150 })
1145
+ t.keyboard(:remove)
1146
+ end
1147
+ c3.touch(true) do
1148
+ t.edit(false)
1149
+ text({ data: 'stop editing', top: 150 })
1150
+ end
1151
+ #
1152
+
1153
+ puts "current user: #{Universe.current_user}"
1154
+ human({ id: :jeezs, login: true })
1155
+
1156
+ puts "current user: #{Universe.current_user}"
1157
+ wait 2 do
1158
+ human({ id: :toto, login: true })
1159
+ puts "current user: #{Universe.current_user}"
1160
+ end
1161
+
1162
+ # For now markup can only be specified at creation time, it will be possible later
1163
+ the_one = text({ data: :hello, markup: :h1 })#
1164
+
1165
+
1166
+
1167
+ box({ color: :red, width: :auto, left: 120, right: 120, id: :box_1 })
1168
+ circle({ left: 33, top: 200, id: :circle_1 })
1169
+ circle({ left: 200, top: 200, id: :circle_2 })
1170
+ circle({ left: 400, top: 200, id: :circle_3 })
1171
+ circle({ left: 600, top: 200, id: :circle_4 })
1172
+ text({ data: "resize the window to it's minimum to activate response", id: :my_text })
1173
+
1174
+ A.match({condition:{max: {width: 777}, min: {height: 333}, operator: :and }}) do
1175
+ {
1176
+ circle_1: { color: :red , width: 23},
1177
+ circle_2: { color: :orange , width: 23, top: 12},
1178
+ box_1: { width: 123, left: 222, color: :blue, rotate: 22}
1179
+ }
1180
+ end
1181
+
1182
+ # match can work without any condition then the particles are always applied
1183
+
1184
+ # A.match({}) do
1185
+ # {
1186
+ # circle_1: { color: :red, width: 23 },
1187
+ # circle_2: { color: :orange, width: 23, top: 12 },
1188
+ # box_1: { width: 123, left: 222, color: :blue, rotate: 22 }
1189
+ # }
1190
+ # end
1191
+
1192
+
1193
+ #
1194
+ b = box({ color: :red })
1195
+
1196
+ b.touch(true) do
1197
+ b.connection('localhost:9292') do |params|
1198
+ alert " the connection is : #{params}"
1199
+ end
1200
+ end
1201
+
1202
+ c = box({ color: :yellow, left: 333 })
1203
+
1204
+ c.touch(true) do
1205
+ b.message('hi there!!')
1206
+ # c = box({ color: :red, left: 333 })
1207
+ end
1208
+
1209
+ b = box({ id: :the_box })
1210
+ c = circle({ top: 3, id: :the_cirle })
1211
+ A.monitor({ atomes: [:the_box, :the_cirle], particles: [:left] }) do |atome, particle, value|
1212
+ puts "changes : #{atome.id}, #{particle}, #{value}"
1213
+ end
1214
+
1215
+ wait 2 do
1216
+ b.left(3)
1217
+ wait 2 do
1218
+ c.left(444)
1219
+ end
1220
+ end
1221
+
1222
+
1223
+ # please note that whatever the atome resize will return the size of the view!
1224
+ view = grab(:view)
1225
+ view.on(:resize) do |event|
1226
+ puts "view size is #{event}"
1227
+ end
1228
+
1229
+ text online?#
1230
+
1231
+ b = box({ left: 666, color: :blue, smooth: 6, id: :the_box2 })
1232
+ b.over(true) do
1233
+ b.color(:black)
1234
+ # puts "I'm inside"
1235
+ end
1236
+ b.over(:enter) do
1237
+ puts "in"
1238
+ puts "enter"
1239
+ b.width= b.width+30
1240
+ # alert :in
1241
+ b.color(:yellow)
1242
+ end
1243
+ b.over(:leave) do
1244
+ b.height= b.height+10
1245
+ puts "out"
1246
+ puts "leave"
1247
+ # alert :out
1248
+ b.color(:orange)
1249
+ end
1250
+
1251
+ #
1252
+ t=b.text('touch me to stop over leave')
1253
+ b.touch(true) do
1254
+ b.over({ remove: :enter })
1255
+ t.data('finished')
1256
+ end
1257
+
1258
+
1259
+
1260
+ c=circle({drag: true, id: :the_circle})
1261
+
1262
+ c1=c.color(:white).id
1263
+ c2=c.color(:red).id
1264
+ c3=c.color(:yellow).id
1265
+ color({id: :toto, red: 1 , alpha: 0.5})
1266
+ wait 0.5 do
1267
+ c.paint({ gradient: [c1,c2], direction: :left })
1268
+ wait 0.5 do
1269
+ c.paint({ gradient: [c1,c2, c3], direction: :left })
1270
+ wait 0.5 do
1271
+ c.paint({ gradient: [c1,c2], diffusion: :radial })
1272
+ wait 0.5 do
1273
+ c.paint({ gradient: [c1,c2, c3], diffusion: :conic })
1274
+ wait 0.5 do
1275
+ c.remove({all: :paint})
1276
+ end
1277
+ end
1278
+ end
1279
+ end
1280
+ end
1281
+
1282
+
1283
+ b = box({ left: 777 })
1284
+ puts "b ahas the following paticles : #{b.particles}"
1285
+
1286
+ bb=box({width: '90%'})
1287
+ puts bb.to_px(:width)
1288
+
1289
+ if Universe.internet
1290
+ # v = video({ path: "medias/videos/avengers.mp4", id: :my_video })
1291
+ v = video({ path: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4" })
1292
+ else
1293
+ v = video(:video_missing)
1294
+ end
1295
+ v.left(200)
1296
+ v.touch(true) do
1297
+ alert v.play
1298
+ end
1299
+
1300
+ t=text({id: :my_text, data: "play video"})
1301
+
1302
+ t.touch(true) do
1303
+ v.data=0
1304
+ v.play(26) do |event|
1305
+ t.data("event is : #{event}")
1306
+ if event[:frame] == 900 && v.data <3
1307
+ puts v.data
1308
+ v.data(v.data+1)
1309
+ v.play(26)
1310
+ end
1311
+ end
1312
+ end
1313
+
1314
+ c=circle({left: 123})
1315
+
1316
+ c.touch(true) do
1317
+ v.play(:pause)
1318
+ end
1319
+
1320
+ cc=circle({left: 0, width: 55, height: 55})
1321
+
1322
+ left=0
1323
+ cc.drag(:locked) do |event|
1324
+ dx = event[:dx]
1325
+ left += dx.to_f
1326
+ min_left = 0
1327
+ max_left = 600
1328
+ left = [min_left, left].max
1329
+ left = [left, max_left].min
1330
+ v.html.currentTime(left/10)
1331
+ cc.left(left)
1332
+ end
1333
+
1334
+
1335
+
1336
+
1337
+ puts "add lock x and y when drag"
1338
+ puts "restrict ro :view doesnt work"
1339
+
1340
+
1341
+ # here how ti use preset in the atome framework
1342
+ # presets available are : render_engines,image,video,animation,element,box,vector,circle,shape,text,drm,shadow,color,www,raw,code,audio,group,human,machine,paint
1343
+
1344
+ my_box=box
1345
+ # using the code line above a lot of particles will be implicitly created, if we inspect my_box
1346
+ puts my_box.inspect # this will print :
1347
+ #[Log] #<Atome: @broadcast={}, @callback={}, @tag={}, @attached=[], @unit={}, @collected={}, @id=:box_14, @type=:shape, @html=#<HTML:0x0662a164 @element=[object HTMLDivElement], @id="box_14", @original_atome=#<Atome: @broadcast={}, @callback={}, @tag={}, @attached=[], @unit={}, @collected={}, @id=:box_14, @type=:shape, @html=#<HTML:0x0662a164 ...>, @attach=[:view], @renderers=[:html], @width=99, @height=99, @apply=[:box_color], @left=100, @top=100, @clones=[], @preset={:box=>{:width=>99, :height=>99, :apply=>[:box_color], :left=>100, :top=>100, :clones=>[]}}>, @element_type="div">, @attach=[:view], @renderers=[:html], @width=99, @height=99, @apply=[:box_color], @left=100, @top=100, @clones=[], @preset={:box=>{:width=>99, :height=>99, :apply=>[:box_color], :left=>100, :top=>100, :clones=>[]}}> (browser.script.iife.min.js, line 13)
1348
+
1349
+ # please note that an ID is automatically created using a simple strategy id : atome_type_total_number_of_users_atomes ex here : @id="box_14"
1350
+
1351
+ my_box.text("touch me")
1352
+ puts " my_box preset is : #{my_box.preset}"
1353
+ # print in the console : [Log] my_box preset is : {:box=>{:width=>99, :height=>99, :apply=>[:box_color], :left=>100, :top=>100, :clones=>[]}} (browser.script.iife.min.js, line 13)
1354
+
1355
+
1356
+ c=circle
1357
+ puts " c is : #{c.inspect }"
1358
+ # this print : [Log] c is : #<Atome: @type=:shape, @smooth="100%", @width=99, @id=:circle_16, @renderers=[:html], @height=99, @broadcast={}, @callback={}, @tag={}, @attached=[], @unit={}, @collected={}, @html=#<HTML:0x06579be8 @element=[object HTMLDivElement], @id="circle_16", @original_atome=#<Atome: @type=:shape, @smooth="100%", @width=99, @id=:circle_16, @renderers=[:html], @height=99, @broadcast={}, @callback={}, @tag={}, @attached=[], @unit={}, @collected={}, @html=#<HTML:0x06579be8 ...>, @top=100, @attach=[:view], @left=100, @apply=[:circle_color], @clones=[], @preset={:circle=>{:width=>99, :height=>99, :smooth=>"100%", :apply=>[:circle_color], :left=>100, :top=>100, :clones=>[]}}>, @element_type="div">, @top=100, @attach=[:view], @left=100, @apply=[:circle_color], @clones=[], @preset={:circle=>{:width=>99, :height=>99, :smooth=>"100%", :apply=>[:circle_color], :left=>100, :top=>100, :clones=>[]}}> (browser.script.iife.min.js, line 13)
1359
+ # it's pôssible to alter basic preset using the particle .preset
1360
+ my_box.preset({ circle: {type: :shape, :width=>99, :height=>99, :smooth=>"100%", color: :red, :left=>100, :top=>100, :clones=>[]}})
1361
+ puts " my_box preset is now : #{my_box.preset}"
1362
+ # now the preset circle is : [Log] my_box preset is now : {:circle=>{:type=>:shape, :width=>99, :height=>99, :smooth=>"100%", :color=>:red, :left=>100, :top=>100, :clones=>[]}} (browser.script.iife.min.js, line 13)
1363
+
1364
+ my_box.touch(true) do
1365
+ my_box.preset(:circle) # the box now rounded like a circle
1366
+
1367
+ new_circle=circle # as the preset circle has been modified tha circle is now red as specified in the updated preset
1368
+ puts "new_circle is : #{new_circle.inspect}"
1369
+ # this print : new_circle is : #<Atome: @type=:shape, @smooth="100%", @width=99, @id=:circle_18, @renderers=[:html], @height=99, @broadcast={}, @callback={}, @tag={}, @attached=[], @unit={}, @collected={}, @html=#<HTML:0x0664e99c @element=[object HTMLDivElement], @id="circle_18", @original_atome=#<Atome: @type=:shape, @smooth="100%", @width=99, @id=:circle_18, @renderers=[:html], @height=99, @broadcast={}, @callback={}, @tag={}, @attached=[], @unit={}, @collected={}, @html=#<HTML:0x0664e99c ...>, @top=100, @attach=[:box_14], @left=100, @apply=[:circle_18_color_1_0_0_0_0_0____], @clones=[]>, @element_type="div">, @top=100, @attach=[:box_14], @left=100, @apply=[:circle_18_color_1_0_0_0_0_0____], @clones=[]>
1370
+ end
1371
+ #
1372
+
1373
+ raw_data = <<STR
1374
+ <iframe width="560" height="315" src="https://www.youtube.com/embed/8BT4Q3UtO6Q?si=WI8RlryV8HW9Y0nz" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
1375
+ STR
1376
+
1377
+
1378
+ raw_data = <<STR
1379
+ <svg width="600" height="350" xmlns="http://www.w3.org/2000/svg">
1380
+ <!-- Style for the boxes -->
1381
+ <style>
1382
+ .box { fill: white; stroke: black; stroke-width: 2; }
1383
+ .original { fill: lightblue; }
1384
+ .clone { fill: lightgreen; }
1385
+ .arrow { stroke: black; stroke-width: 2; marker-end: url(#arrowhead); }
1386
+ .text { font-family: Arial, sans-serif; font-size: 14px; }
1387
+ </style>
1388
+
1389
+ <!-- Arrowhead definition -->
1390
+ <defs>
1391
+ <marker id="arrowhead" markerWidth="10" markerHeight="7"
1392
+ refX="0" refY="3.5" orient="auto">
1393
+ <polygon points="0 0, 10 3.5, 0 7" fill="black"/>
1394
+ </marker>
1395
+ </defs>
1396
+
1397
+ <!-- Boxes for original and clones -->
1398
+ <rect x="250" y="30" width="100" height="50" class="box original"/>
1399
+ <rect x="100" y="200" width="100" height="50" class="box clone"/>
1400
+ <rect x="250" y="200" width="100" height="50" class="box clone"/>
1401
+ <rect x="400" y="200" width="100" height="50" class="box clone"/>
1402
+
1403
+ <!-- Text for boxes -->
1404
+ <text x="275" y="55" class="text" text-anchor="middle">Original</text>
1405
+ <text x="150" y="225" class="text" text-anchor="middle">Clone 1</text>
1406
+ <text x="300" y="225" class="text" text-anchor="middle">Clone 2</text>
1407
+ <text x="450" y="225" class="text" text-anchor="middle">Clone 3</text>
1408
+
1409
+ <!-- Arrows -->
1410
+ <line x1="300" y1="80" x2="150" y2="200" class="arrow"/>
1411
+ <line x1="300" y1="80" x2="300" y2="200" class="arrow"/>
1412
+ <line x1="300" y1="80" x2="450" y2="200" class="arrow"/>
1413
+ </svg>
1414
+ STR
1415
+
1416
+
1417
+ raw({ id: :the_raw_stuff, data: raw_data })
1418
+
1419
+ A.read('Cargo.toml') do |data|
1420
+ text "file content :\n #{data}"
1421
+ end
1422
+
1423
+
1424
+
1425
+ b = box({ top: 166, data: :hello })
1426
+ c=color({ id: :col1, red: 1, blue: 1})
1427
+
1428
+ b.instance_variable_set("@top", 30)
1429
+ b.instance_variable_set("@apply", [c.id])
1430
+ b.instance_variable_set("@path", './medias/images/red_planet.png' )
1431
+
1432
+ b.instance_variable_set("@smooth", 30)
1433
+ wait 1 do
1434
+ b.refresh
1435
+ b.instance_variable_set("@left", 300)
1436
+ wait 1 do
1437
+ b.refresh
1438
+ b.instance_variable_set("@type", :text)
1439
+ wait 1 do
1440
+ b.refresh
1441
+ b.instance_variable_set("@type", :image)
1442
+ wait 1 do
1443
+ b.refresh
1444
+ end
1445
+ end
1446
+ end
1447
+ end
1448
+
1449
+
1450
+ b = box({ top: 166 , id: :the_box})
1451
+ b.color({id: :new_col, red: 1})
1452
+ b.color({id: :other_col, green: 1})
1453
+ # b.paint({gradient: [:other_col, :new_col]})
1454
+ color({id: :last_col, green: 0.3, blue: 0.5})
1455
+ color({id: :last_col2, red: 1, blue: 0.5})
1456
+
1457
+ b.shadow({
1458
+ id: :s1,
1459
+ # affect: [:the_circle],
1460
+ left: 9, top: 3, blur: 9,
1461
+ invert: false,
1462
+ red: 0, green: 0, blue: 0, alpha: 1
1463
+ })
1464
+ wait 1 do
1465
+ b.remove(:other_col)
1466
+ wait 1 do
1467
+ b.remove(:new_col)
1468
+ wait 1 do
1469
+ b.remove(:box_color)
1470
+ wait 1 do
1471
+ b.apply(:last_col)
1472
+ wait 1 do
1473
+ b.apply(:last_col2)
1474
+ end
1475
+ end
1476
+ end
1477
+ end
1478
+ end
1479
+ b.touch(true) do
1480
+ puts "before => #{b.apply}"
1481
+ b.remove({all: :color})
1482
+ puts "after => #{b.apply}"
1483
+ wait 2 do
1484
+ b.paint({id: :the_gradient_1,gradient: [:box_color, :circle_color]})
1485
+ b.paint({id: :the_gradient,gradient: [:other_col, :new_col]})
1486
+ wait 1 do
1487
+ b.remove(:the_gradient)
1488
+ wait 1 do
1489
+ b.remove(all: :shadow)
1490
+ end
1491
+ end
1492
+ end
1493
+ end
1494
+
1495
+
1496
+
1497
+ m = shape({ id: :the_shape, width: 333, left: 130, top: 30, right: 100, height: 399, smooth: 8, color: :yellowgreen, })
1498
+ m.drag(true)
1499
+ m.on(:resize) do |event|
1500
+ puts event[:dx]
1501
+ end
1502
+
1503
+ m.resize({ size: { min: { width: 10, height: 10 }, max: { width: 300, height: 600 } } }) do |event|
1504
+ puts "width is is #{event[:rect][:width]}"
1505
+ end
1506
+
1507
+ t=text({data: ' click me to unbind resize'})
1508
+ t.touch(true) do
1509
+ t.data('resize unbinded')
1510
+ m.resize(:remove)
1511
+ end
1512
+
1513
+ b = box({ id: :the_container, width: 300, height: 300 })
1514
+ b.box({top: 500, color: :red})
1515
+ cc=b.circle({ top: 160, id: :the_circle })
1516
+
1517
+ initial_height=cc.height
1518
+ b.overflow(:scroll) do |event|
1519
+ new_height = initial_height + event[:top]
1520
+ cc.height(new_height)
1521
+ end#
1522
+
1523
+
1524
+ c=circle({left: 220})
1525
+ t=text({left: 550,data: :hello,password: { read: {atome: :my_secret} }})
1526
+ b = box({ id: :the_box, left: 66,smooth: 1.789,
1527
+ password: {
1528
+ read: {
1529
+ atome: :the_pass,
1530
+ smooth: :read_pass
1531
+ },
1532
+ write: {
1533
+ atome: :the_write_pass,
1534
+ smooth: :write_pass
1535
+ }
1536
+ }
1537
+ })
1538
+
1539
+
1540
+
1541
+ b.authorise({ read: {atome: :the_pass,smooth: :read_pass }, write: {smooth: :write_pass}, destroy: true} )
1542
+ puts b.smooth
1543
+ # next will be rejected because destroy: true
1544
+ puts b.smooth
1545
+ #
1546
+ b.authorise({ read: {atome: :wrong_pass,smooth: :no_read_pass }, write: {smooth: :wrong_write_pass}, destroy: false} )
1547
+ puts 'will send the wrong password'
1548
+ puts b.smooth
1549
+
1550
+ b.authorise({ read: {atome: :wrong_pass,smooth: :read_pass }, write: {smooth: :wrong_write_pass}, destroy: false} )
1551
+ puts "'with send the right password it'll works"
1552
+ puts b.smooth
1553
+ # authorise has two params the first is the password to authorise the second is used to destroy the password or keep for
1554
+ # further alteration of the particle
1555
+ wait 1 do
1556
+ b.authorise({write: {smooth: :write_pass}, destroy: true} )
1557
+ b.smooth(22)
1558
+ wait 1 do
1559
+ b.smooth(12)
1560
+ wait 1 do
1561
+ b.authorise({write: {smooth: :write_pass}, destroy: false} )
1562
+ b.smooth(66)
1563
+ wait 1 do
1564
+ b.authorise({write: {smooth: :false_pass, atome: :no_apss, destroy: true}} )
1565
+ b.smooth(6)
1566
+ end
1567
+ end
1568
+ end
1569
+ end
1570
+
1571
+
1572
+ c = circle({ id: :the_circle, left: 122, color: :orange, drag: { move: true, inertia: true, lock: :start } })
1573
+ c.color({ id: :col1, red: 1, blue: 1 })
1574
+
1575
+ c.shadow({
1576
+ id: :s1,
1577
+ # affect: [:the_circle],
1578
+ left: 9, top: 3, blur: 9,
1579
+ invert: false,
1580
+ red: 0, green: 0, blue: 0, alpha: 1
1581
+ })
1582
+
1583
+ shadow({
1584
+ id: :s2,
1585
+ affect: [:the_circle],
1586
+ left: 3, top: 9, blur: 9,
1587
+ invert: true,
1588
+ red: 0, green: 0, blue: 0, alpha: 1
1589
+ })
1590
+
1591
+ c.shadow({
1592
+ id: :s4,
1593
+ left: 20, top: 0, blur: 9,
1594
+ option: :natural,
1595
+ red: 0, green: 1, blue: 0, alpha: 1
1596
+ })
1597
+
1598
+ wait 2 do
1599
+ c.remove(:s4)
1600
+ wait 2 do
1601
+ c.remove({ all: :shadow })
1602
+ end
1603
+ end
1604
+
1605
+
1606
+ the_text = text({ data: 'hello for al the people in front of their machine', center: true, top: 222, width: 777, component: { size: 66 } })
1607
+
1608
+
1609
+
1610
+ the_text.shadow({
1611
+ id: :s4,
1612
+ left: 20, top: 0, blur: 9,
1613
+ option: :natural,
1614
+ red: 0, green: 1, blue: 0, alpha: 1
1615
+ })
1616
+
1617
+ shape(
1618
+ { renderers: [:html], id: :my_test_box, type: :shape, apply: [:shape_color],
1619
+ left: 120, top: 0, width: 100, smooth: 15, height: 100, overflow: :visible, attached: [], center: true
1620
+ })
1621
+
1622
+
1623
+ b = box({ width: 333, left: 333 })
1624
+ b.smooth(9)
1625
+
1626
+ wait 2 do
1627
+ b.smooth([33, 2, 90])
1628
+ end
1629
+
1630
+
1631
+ b = box
1632
+
1633
+ b.style({ left: 33, width: 44, rotate: 23, color: :yellowgreen, blur: 44 })#
1634
+ b = box({ id: :the_box })
1635
+ b.data(:canyouwritethis)
1636
+ b.rotate(33)
1637
+ b.rotate(88)
1638
+ b.rotate(99)
1639
+ b.rotate(12)
1640
+ b.rotate(6)
1641
+ b.data
1642
+ b.touch(true) do
1643
+ b.data(:super)
1644
+ b.data
1645
+ # operation has two option write or read, it filter the history on those two options, write retrieve all alteration
1646
+ # of the particle , read list everytime a particle was get
1647
+ # id retrieve all operation on a given ID
1648
+ # particle retrieve all operation on a given particle
1649
+ # alert b.retrieve({ operation: :write, id: :the_box, particle: :data })
1650
+ end
1651
+
1652
+
1653
+ # alert b.instance_variable_get('@history')
1654
+ box_rotate_history=b.history({ operation: :write, id: :the_box, particle: :rotate })
1655
+ puts "get all all rotate write operation : #{box_rotate_history}"
1656
+ first_rotate_operation_state=b.history({ operation: :write, id: :the_box, particle: :rotate })[0][:sync]
1657
+
1658
+ # we check if an operation synced (that means saved on atome's server)
1659
+ puts "first rotate operation state : #{box_rotate_history[0]}"
1660
+
1661
+ # we check if an operation synced (that means saved on atome's server)
1662
+ puts "first rotate operation initial state : #{box_rotate_history[0]}"
1663
+ puts "synced : #{first_rotate_operation_state}"
1664
+ first_rotate_operation_number=b.history({ operation: :write, id: :the_box, particle: :rotate })[0][:operation]
1665
+ puts "first rotate 'write' operation number is: #{first_rotate_operation_number}"
1666
+
1667
+ # now we sync the state
1668
+ Universe.synchronised(first_rotate_operation_number, :star_wars)
1669
+ # now we check if it's synced
1670
+ box_rotate_history=b.history({ operation: :write, id: :the_box, particle: :rotate })
1671
+ puts "new state for first rotate operation : #{box_rotate_history[0]}"
1672
+
1673
+
1674
+ b=box
1675
+ b.circle({left: 0, top: 0, tag: {group: :to_grid}})
1676
+ b.box({left: 120, top: 120, tag: {group: :from_grid}})
1677
+ b.circle({left: 240, top: 240, tag: {group: :from_grid}})
1678
+ b.box({left: 330, top: 330,tag: {group: :to_grid}})
1679
+ b.box({left: 330, top: 600,tag: :no_tag})
1680
+
1681
+
1682
+ wait 1 do
1683
+ tagged(:group).each do |atome_id|
1684
+ grab(atome_id).color(:green)
1685
+ wait 1 do
1686
+ tagged({group: :to_grid }).each do |atome_id|
1687
+ grab(atome_id).color(:blue)
1688
+ end
1689
+ end
1690
+ end
1691
+ end
1692
+
1693
+
1694
+ #
1695
+ #
1696
+ #
1697
+ A.terminal('pwd') do |data|
1698
+ text "terminal response :\n #{data}"
1699
+ end
1700
+
1701
+ t2 = text({ data: ['this is ', :super, { data: 'cool', color: :red, id: :new_one }], component: { size: 33 }, left: 120 })
1702
+ the_text = text({ data: 'hello for al the people in front of their machine', center: true, top: 120, width: 77, component: { size: 11 } })
1703
+
1704
+ #
1705
+
1706
+ b = box({ left: 666, color: :blue, smooth: 6, id: :the_box2 })
1707
+
1708
+ t=text({id: :the_text, data: 'type of touch : ?'})
1709
+
1710
+ # t.touch(:down) do
1711
+ # b.touch({remove: :down})
1712
+ # # b.touch(:remove) # or b.touch(false) to remove all touches bindings
1713
+ # t.data('touch down killed')
1714
+ # end
1715
+ # b.touch(true) do
1716
+ # # t.data('type of touch : ?')
1717
+ # b.color(:red)
1718
+ # puts 'box tapped'
1719
+ # end
1720
+ #
1721
+ # b.touch(:long) do
1722
+ # t.data('type of touch is : long ')
1723
+ # b.color(:black)
1724
+ # end
1725
+ #
1726
+ # b.touch(:up) do
1727
+ #
1728
+ # t.data('type of touch is : up ')
1729
+ # b.color(:orange)
1730
+ # end
1731
+ #
1732
+ # b.touch(:down) do
1733
+ # t.data('type of touch is : down ')
1734
+ # b.color(:white)
1735
+ # end
1736
+ #
1737
+ # b.touch(:double) do
1738
+ # t.color(:red)
1739
+ # t.data('type of touch is : double ')
1740
+ # b.color(:yellowgreen)
1741
+ # end
1742
+ #
1743
+ #
1744
+ # b = box({ top: 166, data: :hello,path: './medias/images/red_planet.png' })
1745
+ # b.color({ id: :col1, red: 1, blue: 1})
1746
+ #
1747
+ #
1748
+ # wait 1 do
1749
+ # b.type=:text
1750
+ # b.refresh
1751
+ # wait 1 do
1752
+ # b.type=:image
1753
+ # b.refresh
1754
+ # end
1755
+ # end
1756
+ #
1757
+ # puts "atomes : #{Universe.atomes}"
1758
+ # puts "user_atomes : #{Universe.user_atomes}"
1759
+ # puts "particle_list : #{Universe.particle_list}"
1760
+ # puts "users : #{Universe.users}"
1761
+ # puts "current_machine : #{Universe.current_machine}"
1762
+ # puts "internet connected : #{Universe.internet}"#
1763
+ #
1764
+ # edition = "M257.7 752c2 0 4-0.2 6-0.5L431.9 722c2-0.4 3.9-1.3 5.3-2.8l423.9-423.9c3.9-3.9 3.9-10.2 0-14.1L694.9 114.9c-1.9-1.9-4.4-2.9-7.1-2.9s-5.2 1-7.1 2.9L256.8 538.8c-1.5 1.5-2.4 3.3-2.8 5.3l-29.5 168.2c-1.9 11.1 1.5 21.9 9.4 29.8 6.6 6.4 14.9 9.9 23.8 9.9z m67.4-174.4L687.8 215l73.3 73.3-362.7 362.6-88.9 15.7 15.6-89zM880 836H144c-17.7 0-32 14.3-32 32v36c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-36c0-17.7-14.3-32-32-32z"
1765
+ #
1766
+ # v = vector({ data: { path: { d: edition, id: :p1, stroke: :black, 'stroke-width' => 37, fill: :red } } })
1767
+ #
1768
+ # wait 1 do
1769
+ # v.data(circle: { cx: 1000, cy: 1000, r: 340, id: :p2, stroke: :green, 'stroke-width' => 35, fill: :yellow })
1770
+ # wait 1 do
1771
+ # v.color(:cyan) # colorise everything with the color method
1772
+ # wait 1 do
1773
+ # v.shadow({
1774
+ # id: :s4,
1775
+ # left: 20, top: 0, blur: 9,
1776
+ # option: :natural,
1777
+ # red: 0, green: 1, blue: 0, alpha: 1
1778
+ # })
1779
+ # v.component(p2: {fill: :blue,'stroke-width' => 166 })
1780
+ # v.left(222)
1781
+ # end
1782
+ # end
1783
+ # end
1784
+ #
1785
+ # if Universe.internet
1786
+ # v = video({ path: "http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4" })
1787
+ # else
1788
+ # v = video(:video_missing)
1789
+ # end
1790
+ #
1791
+ # v.touch(true) do
1792
+ # v.play(true)
1793
+ # wait 3 do
1794
+ # v.play(66)
1795
+ # end
1796
+ # end# #
1797
+ # b = box
1798
+ #
1799
+ # wait 2 do
1800
+ # b.color(:red)
1801
+ # end#
1802
+ #
1803
+ # b = box
1804
+ #
1805
+ # b.www({ path: "https://www.youtube.com/embed/usQDazZKWAk", left: 333 })
1806
+ #
1807
+ # Atome.new(
1808
+ # renderers: [:html], id: :youtube1, type: :www, attach: [:view], path: "https://www.youtube.com/embed/fjJOyfQCMvc?si=lPTz18xXqIfd_3Ql", left: 33, top: 33, width: 199, height: 199,
1809
+ #
1810
+ # )