chnobli 0.1.9 → 0.1.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (197) hide show
  1. package/dist/animation/Animation.d.ts +37 -0
  2. package/dist/animation/Animation.d.ts.map +1 -0
  3. package/dist/animation/Animation.js +232 -0
  4. package/dist/animation/Animation.js.map +1 -0
  5. package/dist/animation/public.d.ts +68 -0
  6. package/dist/animation/public.d.ts.map +1 -0
  7. package/dist/animation/public.js +115 -0
  8. package/dist/animation/public.js.map +1 -0
  9. package/dist/animator/Animator.d.ts +30 -0
  10. package/dist/animator/Animator.d.ts.map +1 -0
  11. package/dist/animator/Animator.js +97 -0
  12. package/dist/animator/Animator.js.map +1 -0
  13. package/dist/animator/index.d.ts +5 -0
  14. package/dist/animator/index.d.ts.map +1 -0
  15. package/dist/animator/index.js +53 -0
  16. package/dist/animator/index.js.map +1 -0
  17. package/dist/animator/public.d.ts +16 -0
  18. package/dist/animator/public.d.ts.map +1 -0
  19. package/dist/animator/public.js +50 -0
  20. package/dist/animator/public.js.map +1 -0
  21. package/dist/chnobli.d.ts +15 -0
  22. package/dist/chnobli.d.ts.map +1 -0
  23. package/dist/chnobli.js +59 -0
  24. package/dist/chnobli.js.map +1 -0
  25. package/dist/property/BasicProperty.d.ts +38 -0
  26. package/dist/property/BasicProperty.d.ts.map +1 -0
  27. package/dist/property/BasicProperty.js +72 -0
  28. package/dist/property/BasicProperty.js.map +1 -0
  29. package/dist/property/ClassProperty.d.ts +32 -0
  30. package/dist/property/ClassProperty.d.ts.map +1 -0
  31. package/dist/property/ClassProperty.js +108 -0
  32. package/dist/property/ClassProperty.js.map +1 -0
  33. package/dist/property/Property.d.ts +13 -0
  34. package/dist/property/Property.d.ts.map +1 -0
  35. package/dist/property/Property.js +22 -0
  36. package/dist/property/Property.js.map +1 -0
  37. package/dist/property/StyleProperty.d.ts +25 -0
  38. package/dist/property/StyleProperty.d.ts.map +1 -0
  39. package/dist/property/StyleProperty.js +221 -0
  40. package/dist/property/StyleProperty.js.map +1 -0
  41. package/dist/property/TransformProperty.d.ts +15 -0
  42. package/dist/property/TransformProperty.d.ts.map +1 -0
  43. package/dist/property/TransformProperty.js +43 -0
  44. package/dist/property/TransformProperty.js.map +1 -0
  45. package/dist/property/TransformXYProperty.d.ts +28 -0
  46. package/dist/property/TransformXYProperty.d.ts.map +1 -0
  47. package/dist/property/TransformXYProperty.js +65 -0
  48. package/dist/property/TransformXYProperty.js.map +1 -0
  49. package/dist/responsive/ResponsiveEvent.d.ts +17 -0
  50. package/dist/responsive/ResponsiveEvent.d.ts.map +1 -0
  51. package/dist/responsive/ResponsiveEvent.js +45 -0
  52. package/dist/responsive/ResponsiveEvent.js.map +1 -0
  53. package/dist/responsive/TestEvent.d.ts +11 -0
  54. package/dist/responsive/TestEvent.d.ts.map +1 -0
  55. package/dist/responsive/TestEvent.js +26 -0
  56. package/dist/responsive/TestEvent.js.map +1 -0
  57. package/dist/scroll/Scroll.d.ts +61 -0
  58. package/dist/scroll/Scroll.d.ts.map +1 -0
  59. package/dist/scroll/Scroll.js +280 -0
  60. package/dist/scroll/Scroll.js.map +1 -0
  61. package/dist/scroll/ScrollEvent.d.ts +17 -0
  62. package/dist/scroll/ScrollEvent.d.ts.map +1 -0
  63. package/dist/scroll/ScrollEvent.js +40 -0
  64. package/dist/scroll/ScrollEvent.js.map +1 -0
  65. package/dist/scroll/index.d.ts +8 -0
  66. package/dist/scroll/index.d.ts.map +1 -0
  67. package/dist/scroll/index.js +9 -0
  68. package/dist/scroll/index.js.map +1 -0
  69. package/dist/scroll/public.d.ts +35 -0
  70. package/dist/scroll/public.d.ts.map +1 -0
  71. package/dist/scroll/public.js +50 -0
  72. package/dist/scroll/public.js.map +1 -0
  73. package/dist/stagger/stagger.d.ts +20 -0
  74. package/dist/stagger/stagger.d.ts.map +1 -0
  75. package/dist/stagger/stagger.js +43 -0
  76. package/dist/stagger/stagger.js.map +1 -0
  77. package/dist/target/BaseTarget.old.d.ts +33 -0
  78. package/dist/target/BaseTarget.old.d.ts.map +1 -0
  79. package/dist/target/BaseTarget.old.js +73 -0
  80. package/dist/target/BaseTarget.old.js.map +1 -0
  81. package/dist/target/DomTarget.d.ts +41 -0
  82. package/dist/target/DomTarget.d.ts.map +1 -0
  83. package/dist/target/DomTarget.js +230 -0
  84. package/dist/target/DomTarget.js.map +1 -0
  85. package/dist/target/ObjectTarget.d.ts +31 -0
  86. package/dist/target/ObjectTarget.d.ts.map +1 -0
  87. package/dist/target/ObjectTarget.js +108 -0
  88. package/dist/target/ObjectTarget.js.map +1 -0
  89. package/dist/target/Target.d.ts +25 -0
  90. package/dist/target/Target.d.ts.map +1 -0
  91. package/dist/target/Target.js +25 -0
  92. package/dist/target/Target.js.map +1 -0
  93. package/dist/target/TestDomNode.d.ts +14 -0
  94. package/dist/target/TestDomNode.d.ts.map +1 -0
  95. package/dist/target/TestDomNode.js +55 -0
  96. package/dist/target/TestDomNode.js.map +1 -0
  97. package/dist/timeline/Nested.d.ts +30 -0
  98. package/dist/timeline/Nested.d.ts.map +1 -0
  99. package/dist/timeline/Nested.js +51 -0
  100. package/dist/timeline/Nested.js.map +1 -0
  101. package/dist/timeline/Timeline.d.ts +42 -0
  102. package/dist/timeline/Timeline.d.ts.map +1 -0
  103. package/dist/timeline/Timeline.js +306 -0
  104. package/dist/timeline/Timeline.js.map +1 -0
  105. package/dist/timeline/public.d.ts +167 -0
  106. package/dist/timeline/public.d.ts.map +1 -0
  107. package/dist/timeline/public.js +396 -0
  108. package/dist/timeline/public.js.map +1 -0
  109. package/dist/timing/AnimationFrameTicker.d.ts +32 -0
  110. package/dist/timing/AnimationFrameTicker.d.ts.map +1 -0
  111. package/dist/timing/AnimationFrameTicker.js +138 -0
  112. package/dist/timing/AnimationFrameTicker.js.map +1 -0
  113. package/dist/timing/Ease.d.ts +6 -0
  114. package/dist/timing/Ease.d.ts.map +1 -0
  115. package/dist/timing/Ease.js +15 -0
  116. package/dist/timing/Ease.js.map +1 -0
  117. package/dist/timing/TestTicker.d.ts +19 -0
  118. package/dist/timing/TestTicker.d.ts.map +1 -0
  119. package/dist/timing/TestTicker.js +85 -0
  120. package/dist/timing/TestTicker.js.map +1 -0
  121. package/dist/timing/Ticker.d.ts +16 -0
  122. package/dist/timing/Ticker.d.ts.map +1 -0
  123. package/dist/timing/Ticker.js +2 -0
  124. package/dist/timing/Ticker.js.map +1 -0
  125. package/dist/timing/Timing.d.ts +116 -0
  126. package/dist/timing/Timing.d.ts.map +1 -0
  127. package/dist/timing/Timing.js +310 -0
  128. package/dist/timing/Timing.js.map +1 -0
  129. package/dist/timing/easing.d.ts +158 -0
  130. package/dist/timing/easing.d.ts.map +1 -0
  131. package/dist/timing/easing.js +273 -0
  132. package/dist/timing/easing.js.map +1 -0
  133. package/dist/utils/Events.d.ts +9 -0
  134. package/dist/utils/Events.d.ts.map +1 -0
  135. package/dist/utils/Events.js +35 -0
  136. package/dist/utils/Events.js.map +1 -0
  137. package/dist/utils/internal.d.ts +5 -0
  138. package/dist/utils/internal.d.ts.map +1 -0
  139. package/dist/utils/internal.js +9 -0
  140. package/dist/utils/internal.js.map +1 -0
  141. package/dist/utils/motionpath.d.ts +16 -0
  142. package/dist/utils/motionpath.d.ts.map +1 -0
  143. package/dist/utils/motionpath.js +41 -0
  144. package/dist/utils/motionpath.js.map +1 -0
  145. package/dist/utils/utils.d.ts +44 -0
  146. package/dist/utils/utils.d.ts.map +1 -0
  147. package/dist/utils/utils.js +88 -0
  148. package/dist/utils/utils.js.map +1 -0
  149. package/dist/values/ColorValue.d.ts +12 -0
  150. package/dist/values/ColorValue.d.ts.map +1 -0
  151. package/dist/values/ColorValue.js +134 -0
  152. package/dist/values/ColorValue.js.map +1 -0
  153. package/dist/values/StyleValue.d.ts +41 -0
  154. package/dist/values/StyleValue.d.ts.map +1 -0
  155. package/dist/values/StyleValue.js +159 -0
  156. package/dist/values/StyleValue.js.map +1 -0
  157. package/dist/values/Value.d.ts +13 -0
  158. package/dist/values/Value.d.ts.map +1 -0
  159. package/dist/values/Value.js +38 -0
  160. package/dist/values/Value.js.map +1 -0
  161. package/dist/values/defaultcolors.d.ts +2 -0
  162. package/dist/values/defaultcolors.d.ts.map +1 -0
  163. package/dist/values/defaultcolors.js +149 -0
  164. package/dist/values/defaultcolors.js.map +1 -0
  165. package/eslint.config.js +23 -0
  166. package/package.json +10 -3
  167. package/src/animation/Animation.ts +6 -3
  168. package/src/animator/Animator.ts +130 -0
  169. package/src/animator/index.ts +56 -0
  170. package/src/animator/public.ts +66 -0
  171. package/src/chnobli.ts +3 -2
  172. package/src/property/ClassProperty.ts +1 -1
  173. package/src/property/TransformXYProperty.ts +1 -1
  174. package/src/scroll/Scroll.ts +202 -51
  175. package/src/scroll/ScrollEvent.ts +1 -0
  176. package/src/scroll/index.ts +3 -0
  177. package/src/scroll/public.ts +35 -2
  178. package/src/target/DomTarget.ts +1 -1
  179. package/src/target/ObjectTarget.ts +19 -13
  180. package/src/tests/properties.test.ts +44 -3
  181. package/src/tests/timeline.test.ts +1 -1
  182. package/src/tests/timing.test.ts +32 -0
  183. package/src/tests/usecases.test.ts +40 -2
  184. package/src/tests/values.test.ts +9 -9
  185. package/src/timeline/Timeline.ts +5 -4
  186. package/src/timeline/public.ts +34 -12
  187. package/src/timing/AnimationFrameTicker.ts +6 -1
  188. package/src/timing/TestTicker.ts +7 -1
  189. package/src/timing/Ticker.ts +5 -1
  190. package/src/timing/Timing.ts +127 -91
  191. package/src/utils/Events.ts +1 -1
  192. package/src/utils/motionpath.ts +5 -5
  193. package/src/utils/utils.ts +0 -10
  194. package/src/values/ColorValue.ts +1 -0
  195. package/src/values/Value.ts +1 -1
  196. package/.eslintrc.cjs +0 -39
  197. package/src/animator.js +0 -187
@@ -0,0 +1,149 @@
1
+ export const COLORS = {
2
+ black: [0, 0, 0],
3
+ silver: [192, 192, 192],
4
+ gray: [128, 128, 128],
5
+ white: [255, 255, 255],
6
+ maroon: [128, 0, 0],
7
+ red: [255, 0, 0],
8
+ purple: [128, 0, 128],
9
+ fuchsia: [255, 0, 255],
10
+ green: [0, 128, 0],
11
+ lime: [0, 255, 0],
12
+ olive: [128, 128, 0],
13
+ yellow: [255, 255, 0],
14
+ navy: [0, 0, 128],
15
+ blue: [0, 0, 255],
16
+ teal: [0, 128, 128],
17
+ aqua: [0, 255, 255],
18
+ aliceblue: [240, 248, 255],
19
+ antiquewhite: [250, 235, 215],
20
+ aquamarine: [127, 255, 212],
21
+ azure: [240, 255, 255],
22
+ beige: [245, 245, 220],
23
+ bisque: [255, 228, 196],
24
+ blanchedalmond: [255, 235, 205],
25
+ blueviolet: [138, 43, 226],
26
+ brown: [165, 42, 42],
27
+ burlywood: [222, 184, 135],
28
+ cadetblue: [95, 158, 160],
29
+ chartreuse: [127, 255, 0],
30
+ chocolate: [210, 105, 30],
31
+ coral: [255, 127, 80],
32
+ cornflowerblue: [100, 149, 237],
33
+ cornsilk: [255, 248, 220],
34
+ crimson: [220, 20, 60],
35
+ cyan: [0, 255, 255],
36
+ darkblue: [0, 0, 139],
37
+ darkcyan: [0, 139, 139],
38
+ darkgoldenrod: [184, 134, 11],
39
+ darkgray: [169, 169, 169],
40
+ darkgreen: [0, 100, 0],
41
+ darkgrey: [169, 169, 169],
42
+ darkkhaki: [189, 183, 107],
43
+ darkmagenta: [139, 0, 139],
44
+ darkolivegreen: [85, 107, 47],
45
+ darkorange: [255, 140, 0],
46
+ darkorchid: [153, 50, 204],
47
+ darkred: [139, 0, 0],
48
+ darksalmon: [233, 150, 122],
49
+ darkseagreen: [143, 188, 143],
50
+ darkslateblue: [72, 61, 139],
51
+ darkslategray: [47, 79, 79],
52
+ darkslategrey: [47, 79, 79],
53
+ darkturquoise: [0, 206, 209],
54
+ darkviolet: [148, 0, 211],
55
+ deeppink: [255, 20, 147],
56
+ deepskyblue: [0, 191, 255],
57
+ dimgray: [105, 105, 105],
58
+ dimgrey: [105, 105, 105],
59
+ dodgerblue: [30, 144, 255],
60
+ firebrick: [178, 34, 34],
61
+ floralwhite: [255, 250, 240],
62
+ forestgreen: [34, 139, 34],
63
+ gainsboro: [220, 220, 220],
64
+ ghostwhite: [248, 248, 255],
65
+ gold: [255, 215, 0],
66
+ goldenrod: [218, 165, 32],
67
+ greenyellow: [173, 255, 47],
68
+ honeydew: [240, 255, 240],
69
+ hotpink: [255, 105, 180],
70
+ indianred: [205, 92, 92],
71
+ indigo: [75, 0, 130],
72
+ ivory: [255, 255, 240],
73
+ khaki: [240, 230, 140],
74
+ lavender: [230, 230, 250],
75
+ lavenderblush: [255, 240, 245],
76
+ lawngreen: [124, 252, 0],
77
+ lemonchiffon: [255, 250, 205],
78
+ lightblue: [173, 216, 230],
79
+ lightcoral: [240, 128, 128],
80
+ lightcyan: [224, 255, 255],
81
+ lightgoldenrodyellow: [250, 250, 210],
82
+ lightgray: [211, 211, 211],
83
+ lightgreen: [144, 238, 144],
84
+ lightgrey: [211, 211, 211],
85
+ lightpink: [255, 182, 193],
86
+ lightsalmon: [255, 160, 122],
87
+ lightseagreen: [32, 178, 170],
88
+ lightskyblue: [135, 206, 250],
89
+ lightslategray: [119, 136, 153],
90
+ lightslategrey: [119, 136, 153],
91
+ lightsteelblue: [176, 196, 222],
92
+ lightyellow: [255, 255, 224],
93
+ limegreen: [50, 205, 50],
94
+ linen: [250, 240, 230],
95
+ magenta: [255, 0, 255],
96
+ mediumaquamarine: [102, 205, 170],
97
+ mediumblue: [0, 0, 205],
98
+ mediumorchid: [186, 85, 211],
99
+ mediumpurple: [147, 112, 219],
100
+ mediumseagreen: [60, 179, 113],
101
+ mediumslateblue: [123, 104, 238],
102
+ mediumspringgreen: [0, 250, 154],
103
+ mediumturquoise: [72, 209, 204],
104
+ mediumvioletred: [199, 21, 133],
105
+ midnightblue: [25, 25, 112],
106
+ mintcream: [245, 255, 250],
107
+ mistyrose: [255, 228, 225],
108
+ moccasin: [255, 228, 181],
109
+ navajowhite: [255, 222, 173],
110
+ oldlace: [253, 245, 230],
111
+ olivedrab: [107, 142, 35],
112
+ orange: [255, 165, 0],
113
+ orangered: [255, 69, 0],
114
+ orchid: [218, 112, 214],
115
+ palegoldenrod: [238, 232, 170],
116
+ palegreen: [152, 251, 152],
117
+ paleturquoise: [175, 238, 238],
118
+ palevioletred: [219, 112, 147],
119
+ papayawhip: [255, 239, 213],
120
+ peachpuff: [255, 218, 185],
121
+ peru: [205, 133, 63],
122
+ pink: [255, 192, 203],
123
+ plum: [221, 160, 221],
124
+ powderblue: [176, 224, 230],
125
+ rosybrown: [188, 143, 143],
126
+ royalblue: [65, 105, 225],
127
+ saddlebrown: [139, 69, 19],
128
+ salmon: [250, 128, 114],
129
+ sandybrown: [244, 164, 96],
130
+ seagreen: [46, 139, 87],
131
+ seashell: [255, 245, 238],
132
+ sienna: [160, 82, 45],
133
+ skyblue: [135, 206, 235],
134
+ slateblue: [106, 90, 205],
135
+ slategray: [112, 128, 144],
136
+ slategrey: [112, 128, 144],
137
+ snow: [255, 250, 250],
138
+ springgreen: [0, 255, 127],
139
+ steelblue: [70, 130, 180],
140
+ tan: [210, 180, 140],
141
+ thistle: [216, 191, 216],
142
+ tomato: [255, 99, 71],
143
+ turquoise: [64, 224, 208],
144
+ violet: [238, 130, 238],
145
+ wheat: [245, 222, 179],
146
+ whitesmoke: [245, 245, 245],
147
+ yellowgreen: [154, 205, 50],
148
+ };
149
+ //# sourceMappingURL=defaultcolors.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"defaultcolors.js","sourceRoot":"","sources":["../../src/values/defaultcolors.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,MAAM,GAA6C;IAC/D,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;IAChB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACvB,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACrB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC;IACnB,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC;IAChB,MAAM,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;IACrB,OAAO,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;IACtB,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IAClB,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACjB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACpB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACrB,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;IACjB,IAAI,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;IACjB,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACnB,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACnB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC7B,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACvB,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC/B,UAAU,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;IAC1B,KAAK,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IACpB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACzB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IACzB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IACrB,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC/B,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IACtB,IAAI,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACnB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;IACrB,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IACvB,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IAC7B,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,SAAS,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACtB,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,WAAW,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;IAC1B,cAAc,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC;IAC7B,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACzB,UAAU,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;IAC1B,OAAO,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC;IACpB,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC7B,aAAa,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC;IAC5B,aAAa,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IAC3B,aAAa,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC;IAC3B,aAAa,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IAC5B,UAAU,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;IACzB,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;IACxB,WAAW,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACxB,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACxB,UAAU,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IACxB,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC5B,WAAW,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC;IAC1B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACnB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IACzB,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IAC3B,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACxB,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IACxB,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,GAAG,CAAC;IACpB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACxB,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC7B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,oBAAoB,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACrC,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC5B,aAAa,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IAC7B,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC7B,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC/B,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC/B,cAAc,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC/B,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC5B,SAAS,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC;IACxB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,OAAO,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,GAAG,CAAC;IACtB,gBAAgB,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACjC,UAAU,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC;IACvB,YAAY,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;IAC5B,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC7B,cAAc,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9B,eAAe,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAChC,iBAAiB,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IAChC,eAAe,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IAC/B,eAAe,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;IAC/B,YAAY,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,GAAG,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC5B,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACxB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IACzB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACrB,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,CAAC,CAAC;IACvB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACvB,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9B,aAAa,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9B,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IACpB,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACrB,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACrB,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,WAAW,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IAC1B,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACvB,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IAC1B,QAAQ,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC;IACvB,QAAQ,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IACrB,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACxB,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,GAAG,CAAC;IACzB,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACrB,WAAW,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC;IAC1B,SAAS,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,GAAG,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACpB,OAAO,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACxB,MAAM,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC;IACrB,SAAS,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,CAAC;IACzB,MAAM,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACvB,KAAK,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IACtB,UAAU,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC3B,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;CAC3B,CAAC"}
@@ -0,0 +1,23 @@
1
+ // @ts-check
2
+
3
+ import eslint from '@eslint/js';
4
+ import tseslint from 'typescript-eslint';
5
+
6
+ export default tseslint.config(
7
+ eslint.configs.recommended,
8
+ ...tseslint.configs.recommended,
9
+ {
10
+ rules: {
11
+ '@typescript-eslint/no-explicit-any': 'off',
12
+ '@typescript-eslint/ban-ts-comment': 'off',
13
+ '@typescript-eslint/no-unused-vars': [
14
+ 'error',
15
+ {
16
+ argsIgnorePattern: '^_',
17
+ varsIgnorePattern: '^_',
18
+ caughtErrorsIgnorePattern: '^_',
19
+ },
20
+ ],
21
+ },
22
+ },
23
+ );
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "chnobli",
3
- "version": "0.1.9",
3
+ "version": "0.1.11",
4
4
  "author": "Sören Meier <info@soerenmeier.ch>",
5
5
  "type": "module",
6
6
  "scripts": {
@@ -30,17 +30,24 @@
30
30
  "import": "./dist/scroll/index.js",
31
31
  "types": "./dist/scroll/index.d.ts"
32
32
  },
33
+ "./animator": {
34
+ "import": "./dist/animator/index.js",
35
+ "types": "./dist/animator/index.d.ts"
36
+ },
33
37
  ".": {
34
38
  "import": "./dist/chnobli.js",
35
39
  "types": "./dist/chnobli.d.ts"
36
40
  }
37
41
  },
38
42
  "devDependencies": {
39
- "eslint": "^8.45.0",
43
+ "@eslint/js": "^9.4.0",
44
+ "@types/eslint__js": "^8.42.3",
45
+ "eslint": "^8.57.0",
40
46
  "jsdoc": "^4.0.2",
41
47
  "prettier": "^3.2.4",
42
48
  "tslib": "^2.6.2",
43
- "typescript": "^5.1.6",
49
+ "typescript": "^5.4.5",
50
+ "typescript-eslint": "^7.11.0",
44
51
  "vitest": "^1.1.3"
45
52
  },
46
53
  "dependencies": {
@@ -7,6 +7,7 @@ import Timing, {
7
7
  import Property, { ParseableValue, newProperty } from '../property/Property.js';
8
8
  import Ticker from '../timing/Ticker.js';
9
9
  import { Target } from '../target/Target.js';
10
+ import { DestroyOptions } from '../timeline/public.js';
10
11
 
11
12
  export default class Animation {
12
13
  timing: Timing;
@@ -95,9 +96,11 @@ export default class Animation {
95
96
  }
96
97
  }
97
98
 
98
- destroy() {
99
- for (const prop of this._props) {
100
- prop.restoreBefore(this.target);
99
+ destroy(opts: DestroyOptions) {
100
+ if (!opts.keepValues) {
101
+ for (const prop of this._props) {
102
+ prop.restoreBefore(this.target);
103
+ }
101
104
  }
102
105
 
103
106
  this._ticker.unregisterTarget(this.target.inner());
@@ -0,0 +1,130 @@
1
+ import Property, { newProperty } from '../property/Property.js';
2
+ import { Target } from '../target/Target.js';
3
+ import Ticker from '../timing/Ticker.js';
4
+ import Timing, { STATE_AFTER } from '../timing/Timing.js';
5
+
6
+ export type Settings = {
7
+ duration: number;
8
+ ease?: (t: number) => number;
9
+ };
10
+
11
+ /*
12
+
13
+ const opacity = animator(obj, {
14
+ duration: 200,
15
+ ease: sinInOut
16
+ });
17
+
18
+ opacity.set({ opacity: 0 });
19
+
20
+ opacity.to({ opacity: 1 });
21
+ opacity.to({ opacity: 2 }, 1000);
22
+ */
23
+
24
+ export default class Animator {
25
+ setts: Settings;
26
+ target: Target;
27
+ private props: Map<string, PropertyAnimator<any>>;
28
+
29
+ private ticker: Ticker;
30
+
31
+ constructor(target: any, ticker: Ticker, setts: Settings) {
32
+ this.setts = setts;
33
+ this.target = ticker.registerTarget(target);
34
+
35
+ this.ticker = ticker;
36
+
37
+ this.props = new Map();
38
+ }
39
+
40
+ private getProp(name: string): PropertyAnimator<any> {
41
+ const prop = this.props.get(name);
42
+ if (prop) return prop;
43
+
44
+ const newProp = new PropertyAnimator(name, this.setts, this.target);
45
+ this.props.set(name, newProp);
46
+ return newProp;
47
+ }
48
+
49
+ set(props: Record<string, any>) {
50
+ for (const prop in props) {
51
+ const propAni = this.getProp(prop);
52
+ console.log('got prop ani', propAni);
53
+ propAni.set(this.target, props[prop]);
54
+ console.log('got prop ani', propAni);
55
+ }
56
+ }
57
+
58
+ to(props: Record<string, any>, duration?: number) {
59
+ for (const prop in props) {
60
+ const propAni = this.getProp(prop);
61
+ propAni.to(this.target, props[prop], duration);
62
+ }
63
+ }
64
+
65
+ /// returns if the ticker should keep running
66
+ _tick(change: number): boolean {
67
+ let shouldStop = true;
68
+
69
+ for (const prop of this.props.values()) {
70
+ prop.advance(change);
71
+ prop.render(this.target);
72
+
73
+ if (prop.timing.state < STATE_AFTER) {
74
+ shouldStop = false;
75
+ }
76
+ }
77
+
78
+ return !shouldStop;
79
+ }
80
+ }
81
+
82
+ export class PropertyAnimator<V> {
83
+ prop: Property<V>;
84
+ timing: Timing;
85
+
86
+ private initialized: boolean;
87
+
88
+ constructor(prop: string, setts: Settings, target: Target) {
89
+ this.prop = newProperty(prop, target.type());
90
+
91
+ this.timing = new Timing(setts);
92
+ this.initialized = false;
93
+ }
94
+
95
+ set(target: Target, value: any) {
96
+ const val = this.prop.parseValue(value);
97
+
98
+ this.prop.init(target, val, val);
99
+
100
+ this.timing.seek(2);
101
+ }
102
+
103
+ to(target: Target, value: any, duration?: number) {
104
+ const val = this.prop.parseValue(value);
105
+
106
+ let current = null;
107
+ if (this.initialized) {
108
+ current = this.prop.interpolate(this.timing.position);
109
+ }
110
+
111
+ this.prop.init(target, current, val);
112
+ this.initialized = true;
113
+
114
+ this.timing.seek(0);
115
+ if (typeof duration === 'number') {
116
+ this.timing.setDuration(duration);
117
+ }
118
+ }
119
+
120
+ advance(change: number) {
121
+ this.timing.advance(change);
122
+ }
123
+
124
+ // call advance first
125
+ render(target: Target) {
126
+ const pos = this.timing.position;
127
+
128
+ this.prop.setValue(target, this.prop.interpolate(pos));
129
+ }
130
+ }
@@ -0,0 +1,56 @@
1
+ /*
2
+
3
+ const obj = { opacity: 1 };
4
+ // maybe we could even have stagger?
5
+ const opacity = animator(obj, {
6
+ // initial value
7
+ // might also be able to be set with stagger?
8
+ // for example
9
+ opacity: 1,
10
+
11
+ duration: 200,
12
+ ease: sineInOut
13
+ });
14
+
15
+ // or maybe instead
16
+
17
+ const animator = animator();
18
+ animator.add(obj, {
19
+ opacity: 1,
20
+ duration: 200,
21
+ ease: sineInOut
22
+ });
23
+
24
+ // what is the reason why we would wan't one animator with
25
+ // multiple objects with different timings
26
+ // could we not just use multiple animators
27
+
28
+
29
+ opacity.set(obj, { opacity: 0 });
30
+
31
+ let's make the most basic animator first
32
+
33
+
34
+ const opacity = animator(obj, {
35
+ duration: 200,
36
+ ease: sinInOut
37
+ });
38
+
39
+ opacity.set({ opacity: 0 });
40
+
41
+ opacity.to({ opacity: 1 });
42
+ opacity.to({ opacity: 2 }, 1000);
43
+
44
+
45
+
46
+
47
+ */
48
+
49
+ import Animator, { AnimatorProps } from './public.js';
50
+
51
+ export { Animator };
52
+ export type { AnimatorProps };
53
+
54
+ export function animator(target: any, props?: AnimatorProps): Animator {
55
+ return new Animator(target, props);
56
+ }
@@ -0,0 +1,66 @@
1
+ /*
2
+ set,
3
+ to,
4
+ */
5
+
6
+ import AnimationFrameTicker from '../timing/AnimationFrameTicker.js';
7
+ import Ticker from '../timing/Ticker.js';
8
+ import Events from '../utils/Events.js';
9
+ import Animator from './Animator.js';
10
+
11
+ export type AnimatorProps = {
12
+ duration?: number;
13
+ ease?: (t: number) => number;
14
+ };
15
+
16
+ export default class PublicAnimator {
17
+ private ticker: Ticker;
18
+ private inner: Animator;
19
+ private runningTicker: any;
20
+ private events: Events;
21
+
22
+ constructor(target: any, props: AnimatorProps = {}) {
23
+ this.ticker = AnimationFrameTicker.global();
24
+ this.inner = new Animator(target, this.ticker, {
25
+ duration: props.duration ?? 1000,
26
+ ease: props.ease,
27
+ });
28
+ this.events = new Events();
29
+ }
30
+
31
+ set(props: Record<string, any>): this {
32
+ this.inner.set(props);
33
+ this.startTicker();
34
+
35
+ return this;
36
+ }
37
+
38
+ to(props: Record<string, any>, duration?: number): this {
39
+ this.inner.to(props, duration);
40
+ this.startTicker();
41
+
42
+ return this;
43
+ }
44
+
45
+ // on: update
46
+ on(ev: string, fn: (...args: any[]) => void): () => void {
47
+ return this.events.add(ev, fn);
48
+ }
49
+
50
+ private startTicker() {
51
+ if (this.runningTicker) return;
52
+
53
+ this.runningTicker = this.ticker.add((change, opts) => {
54
+ const keepRunning = this.inner._tick(change);
55
+
56
+ opts.onApplied(() => {
57
+ this.events.trigger('update');
58
+ });
59
+
60
+ if (!keepRunning) {
61
+ opts.remove();
62
+ this.runningTicker = null;
63
+ }
64
+ });
65
+ }
66
+ }
package/src/chnobli.ts CHANGED
@@ -1,11 +1,12 @@
1
1
  import Animation, { AnimationProps } from './animation/public.js';
2
- import Timeline from './timeline/public.js';
2
+ import Timeline, { TimelineProps } from './timeline/public.js';
3
3
  import Stagger, { type StaggerValue } from './stagger/stagger.js';
4
4
  import type { Targets, AnimationTarget } from './target/Target.js';
5
5
 
6
6
  export type {
7
7
  Animation,
8
8
  Timeline,
9
+ TimelineProps,
9
10
  Stagger,
10
11
  Targets,
11
12
  AnimationTarget,
@@ -28,7 +29,7 @@ export function animate(
28
29
  return new Animation(targets, props);
29
30
  }
30
31
 
31
- export function timeline(props: Record<string, any> = {}): Timeline {
32
+ export function timeline(props: TimelineProps = {}): Timeline {
32
33
  return new Timeline(props);
33
34
  }
34
35
 
@@ -77,7 +77,7 @@ export default class ClassProperty implements Property<string[], Interpolated> {
77
77
  * and in reverse add it at pos 1
78
78
  */
79
79
 
80
- let obj: Interpolated = {
80
+ const obj: Interpolated = {
81
81
  add: [],
82
82
  remove: [],
83
83
  };
@@ -1,5 +1,5 @@
1
1
  import Value from '../values/Value.js';
2
- import Property, { ParseableValue } from './Property.js';
2
+ import Property from './Property.js';
3
3
  import { Target } from '../target/Target.js';
4
4
 
5
5
  export type XYValue = {