vsn 0.1.122 → 0.1.124

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 (150) hide show
  1. package/demo/demo.html +5 -2
  2. package/demo/examples/replace-html.html +19 -0
  3. package/demo/resources/xhr-animations.html +24 -0
  4. package/demo/resources/xhr-html.html +1 -0
  5. package/demo/{xhr.html → resources/xhr-lazy.html} +28 -2
  6. package/demo/silly-animations.html +12 -24
  7. package/demo/vsn.js +2 -2
  8. package/demo/xhr-test.html +4 -0
  9. package/dist/AST/ArrayNode.js +70 -18
  10. package/dist/AST/ArrayNode.js.map +1 -1
  11. package/dist/AST/AssignmentNode.js +93 -37
  12. package/dist/AST/AssignmentNode.js.map +1 -1
  13. package/dist/AST/BlockNode.js +17 -1
  14. package/dist/AST/BlockNode.js.map +1 -1
  15. package/dist/AST/ClassNode.js +225 -87
  16. package/dist/AST/ClassNode.js.map +1 -1
  17. package/dist/AST/ElementAttributeNode.js +55 -29
  18. package/dist/AST/ElementAttributeNode.js.map +1 -1
  19. package/dist/AST/ElementStyleNode.js +55 -31
  20. package/dist/AST/ElementStyleNode.js.map +1 -1
  21. package/dist/AST/FunctionArgumentNode.js +57 -15
  22. package/dist/AST/FunctionArgumentNode.js.map +1 -1
  23. package/dist/AST/FunctionCallNode.js +120 -52
  24. package/dist/AST/FunctionCallNode.js.map +1 -1
  25. package/dist/AST/FunctionNode.js +57 -14
  26. package/dist/AST/FunctionNode.js.map +1 -1
  27. package/dist/AST/IfStatementNode.js +52 -12
  28. package/dist/AST/IfStatementNode.js.map +1 -1
  29. package/dist/AST/IndexNode.js +24 -3
  30. package/dist/AST/IndexNode.js.map +1 -1
  31. package/dist/AST/ModifierNode.js +1 -1
  32. package/dist/AST/ModifierNode.js.map +1 -1
  33. package/dist/AST/NamedStackNode.js +6 -1
  34. package/dist/AST/NamedStackNode.js.map +1 -1
  35. package/dist/AST/Node.d.ts +3 -2
  36. package/dist/AST/Node.js +132 -39
  37. package/dist/AST/Node.js.map +1 -1
  38. package/dist/AST/ObjectNode.js +17 -1
  39. package/dist/AST/ObjectNode.js.map +1 -1
  40. package/dist/AST/OnNode.js +23 -2
  41. package/dist/AST/OnNode.js.map +1 -1
  42. package/dist/AST/ScopeMemberNode.js +40 -16
  43. package/dist/AST/ScopeMemberNode.js.map +1 -1
  44. package/dist/AST/ScopeNodeAbstract.js +29 -8
  45. package/dist/AST/ScopeNodeAbstract.js.map +1 -1
  46. package/dist/AST/StringFormatNode.js +42 -5
  47. package/dist/AST/StringFormatNode.js.map +1 -1
  48. package/dist/AST/WASM/Function.js +20 -4
  49. package/dist/AST/WASM/Function.js.map +1 -1
  50. package/dist/AST/WASM.js +26 -10
  51. package/dist/AST/WASM.js.map +1 -1
  52. package/dist/AST/WithNode.js +81 -41
  53. package/dist/AST/WithNode.js.map +1 -1
  54. package/dist/AST.d.ts +8 -0
  55. package/dist/AST.js +119 -39
  56. package/dist/AST.js.map +1 -1
  57. package/dist/Attribute.d.ts +3 -0
  58. package/dist/Attribute.js +43 -19
  59. package/dist/Attribute.js.map +1 -1
  60. package/dist/Bencmark.js +77 -20
  61. package/dist/Bencmark.js.map +1 -1
  62. package/dist/Component.js +49 -15
  63. package/dist/Component.js.map +1 -1
  64. package/dist/DOM/DOMObject.d.ts +6 -1
  65. package/dist/DOM/DOMObject.js +22 -1
  66. package/dist/DOM/DOMObject.js.map +1 -1
  67. package/dist/DOM.js +451 -194
  68. package/dist/DOM.js.map +1 -1
  69. package/dist/EventDispatcher.js +153 -39
  70. package/dist/EventDispatcher.js.map +1 -1
  71. package/dist/MessageList.js +37 -6
  72. package/dist/MessageList.js.map +1 -1
  73. package/dist/Model.js +27 -6
  74. package/dist/Model.js.map +1 -1
  75. package/dist/Modifiers.d.ts +17 -0
  76. package/dist/Modifiers.js +100 -0
  77. package/dist/Modifiers.js.map +1 -0
  78. package/dist/Scope/DynamicScopeData.js +38 -7
  79. package/dist/Scope/DynamicScopeData.js.map +1 -1
  80. package/dist/Scope/ScopeData.js +29 -8
  81. package/dist/Scope/ScopeData.js.map +1 -1
  82. package/dist/Scope/ScopeDataAbstract.js +103 -27
  83. package/dist/Scope/ScopeDataAbstract.js.map +1 -1
  84. package/dist/Scope/WrappedArray.js +112 -26
  85. package/dist/Scope/WrappedArray.js.map +1 -1
  86. package/dist/Scope/properties/ArrayProperty.js +17 -1
  87. package/dist/Scope/properties/ArrayProperty.js.map +1 -1
  88. package/dist/Scope/properties/Property.js +38 -7
  89. package/dist/Scope/properties/Property.js.map +1 -1
  90. package/dist/Scope.js +70 -13
  91. package/dist/Scope.js.map +1 -1
  92. package/dist/SimplePromise.js +71 -30
  93. package/dist/SimplePromise.js.map +1 -1
  94. package/dist/Tag/TagList.js +22 -1
  95. package/dist/Tag/TagList.js.map +1 -1
  96. package/dist/Tag.d.ts +5 -9
  97. package/dist/Tag.js +515 -196
  98. package/dist/Tag.js.map +1 -1
  99. package/dist/attributes/KeyAbstract.js +1 -1
  100. package/dist/attributes/KeyAbstract.js.map +1 -1
  101. package/dist/attributes/KeyDown.js +1 -1
  102. package/dist/attributes/KeyDown.js.map +1 -1
  103. package/dist/attributes/KeyUp.js +1 -1
  104. package/dist/attributes/KeyUp.js.map +1 -1
  105. package/dist/attributes/LazyAttribute.js +4 -2
  106. package/dist/attributes/LazyAttribute.js.map +1 -1
  107. package/dist/attributes/List.js +77 -30
  108. package/dist/attributes/List.js.map +1 -1
  109. package/dist/attributes/On.d.ts +1 -1
  110. package/dist/attributes/On.js +10 -10
  111. package/dist/attributes/On.js.map +1 -1
  112. package/dist/attributes/RootAttribute.js +29 -8
  113. package/dist/attributes/RootAttribute.js.map +1 -1
  114. package/dist/attributes/ScopeAttribute.js +30 -9
  115. package/dist/attributes/ScopeAttribute.js.map +1 -1
  116. package/dist/attributes/SetAttribute.js +32 -11
  117. package/dist/attributes/SetAttribute.js.map +1 -1
  118. package/dist/attributes/StyleAttribute.js +27 -6
  119. package/dist/attributes/StyleAttribute.js.map +1 -1
  120. package/dist/attributes/XHRAttribute.js +28 -7
  121. package/dist/attributes/XHRAttribute.js.map +1 -1
  122. package/dist/helpers/ElementHelper.js +25 -4
  123. package/dist/helpers/ElementHelper.js.map +1 -1
  124. package/dist/helpers/decorators.js +22 -1
  125. package/dist/helpers/decorators.js.map +1 -1
  126. package/dist/version.d.ts +1 -1
  127. package/dist/version.js +1 -1
  128. package/package.json +1 -1
  129. package/src/AST/AssignmentNode.ts +2 -4
  130. package/src/AST/ElementStyleNode.ts +0 -1
  131. package/src/AST/FunctionNode.ts +2 -0
  132. package/src/AST/ModifierNode.ts +1 -1
  133. package/src/AST/NamedStackNode.ts +4 -1
  134. package/src/AST/Node.ts +10 -5
  135. package/src/AST/OnNode.ts +1 -1
  136. package/src/AST/ScopeNodeAbstract.ts +3 -3
  137. package/src/AST.ts +26 -2
  138. package/src/Attribute.ts +19 -8
  139. package/src/DOM/DOMObject.ts +4 -1
  140. package/src/DOM.ts +2 -2
  141. package/src/Modifiers.ts +54 -0
  142. package/src/Tag.ts +69 -38
  143. package/src/attributes/KeyAbstract.ts +1 -1
  144. package/src/attributes/KeyDown.ts +1 -1
  145. package/src/attributes/KeyUp.ts +1 -1
  146. package/src/attributes/LazyAttribute.ts +6 -2
  147. package/src/attributes/On.ts +10 -9
  148. package/src/attributes/XHRAttribute.ts +2 -2
  149. package/src/version.ts +1 -1
  150. package/tsconfig.base.json +2 -1
package/demo/demo.html CHANGED
@@ -32,6 +32,7 @@
32
32
  function TestItem(name = null, age = null) {
33
33
  this.name = name;
34
34
  this.age = age;
35
+ console.log('TestItem created', name, age);
35
36
  }
36
37
 
37
38
  TestItem.prototype.reset = function () {
@@ -113,6 +114,8 @@
113
114
  <span vsn-bind="toggle.show"></span>
114
115
  </div>
115
116
  <a id="click-test" vsn-on:click="if(@text != @clicktext){@text=@clicktext}else{@text='Click Me'}" clicktext="Clicked!">Click Me</a>
117
+ <br />
118
+ <a vsn-on:click|debounce,500="log('debounced')">Debounce</a>
116
119
 
117
120
  <h2>? Operator</h2>
118
121
  <p>Add/remove class to list of elements on click.</p>
@@ -204,7 +207,7 @@
204
207
  </div>
205
208
 
206
209
  <h2>Lazy XHR Component</h2>
207
- <div vsn-lazy="@html = << './xhr.html'"></div>
210
+ <div vsn-lazy="@html = << './resources/xhr-lazy.html'"></div>
208
211
 
209
212
  <script type="text/javascript">
210
213
  window.addEventListener('vsn', function () {
@@ -225,7 +228,7 @@ class .testing-class {
225
228
  @text = 'Hovered!';
226
229
  }
227
230
 
228
- on mouseleave() {
231
+ on mouseleave|debounce,50() {
229
232
  @text = 'Mouse left';
230
233
  }
231
234
  }
@@ -0,0 +1,19 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>Events</title>
6
+
7
+ <style></style>
8
+ </head>
9
+ <body>
10
+
11
+ <div id="container">
12
+ <div class="test-container">
13
+ <div class="test"></div>
14
+ </div>
15
+ <button vsn-on:click="with ?(.test) {log('wut');wait(1);@html += 'Hello World!';}">Click Me</button>
16
+ </div>
17
+ <script type="text/javascript" src="../vsn.js"></script>
18
+ </body>
19
+ </html>
@@ -0,0 +1,24 @@
1
+ <script type="text/vsn" vsn-script>
2
+ stack animations {
3
+ ?(.testing-stuff).@html += '<li>Testing 2</li>';
4
+ with ?(.test) {
5
+ $opacity = 0;
6
+ wait(1);
7
+ $opacity = 1;
8
+ wait(1);
9
+ $opacity = 0.5;
10
+ }
11
+ wait(1);
12
+ with|sequential ?(.test) {
13
+ $opacity = 0;
14
+ wait(0.25);
15
+ $opacity = 1;
16
+ }
17
+ a = {'b':1};
18
+ with a {
19
+ log(b);
20
+ }
21
+ ?(.testing-stuff).@html = '<li>Testing Reset</li>';
22
+ wait(1);
23
+ }
24
+ </script>
@@ -0,0 +1 @@
1
+ <h1 id="html-header">Testing</h1>
@@ -13,6 +13,7 @@
13
13
  func construct() {
14
14
  log('.simple input construct');
15
15
  a|float = 0.0;
16
+ @value = 'wut';
16
17
  }
17
18
 
18
19
  func deconstruct() {
@@ -24,10 +25,35 @@
24
25
  a += 0.1;
25
26
  log(a);
26
27
  }
28
+
29
+ on mouseenter() {
30
+ with ?>(:parent label) {
31
+ @originaltext = @text;
32
+ @text = 'hovered';
33
+ }
34
+ }
35
+
36
+ on mouseleave() {
37
+ with ?>(:parent label) {
38
+ @text = @originaltext;
39
+ }
40
+ }
41
+ }
42
+
43
+ class input[type=button] {
44
+ on click|throttle,5000() {
45
+ log('button clicked');
46
+ }
27
47
  }
28
48
  }
29
49
  </script>
30
- <div class="simple"><input type="text" /></div>
31
- <div class="simple"><input type="button" /></div>
50
+ <div class="simple">
51
+ <label>Simple Input</label>
52
+ <input type="text" />
53
+ </div>
54
+ <div class="simple">
55
+ <label style="display: block;">Simple Button</label>
56
+ <input type="button" />
57
+ </div>
32
58
  <button vsn-on:click="?(.simple)[0].@class -= 'simple'">Remove</button>
33
59
  </div>
@@ -10,30 +10,18 @@
10
10
  </style>
11
11
  </head>
12
12
  <body>
13
- <ul>
14
- <li class="test test-1" id="test-1">Test 1</li>
15
- <li class="test test-2">Test 2</li>
16
- <li class="test test-1">Test 3</li>
17
- </ul>
13
+ <div id="include"></div>
14
+ <div class="animations-container">
15
+ <ul class="animations">
16
+ <li class="test test-1" id="test-1">Test 1</li>
17
+ <li class="test test-2">Test 2</li>
18
+ <li class="test test-1">Test 3</li>
19
+ </ul>
20
+ <ul class="testing-stuff">
21
+ <li>Testing</li>
22
+ </ul>
23
+ </div>
24
+ <a href="./resources/xhr-animations.html" vsn-xhr="#include.@html = response">GO</a>
18
25
  <script type="text/javascript" src="vsn.js"></script>
19
- <script type="text/vsn" vsn-script|defer>
20
- with ?(.test) {
21
- $opacity = 0;
22
- wait(1);
23
- $opacity = 1;
24
- wait(1);
25
- $opacity = 0.5;
26
- }
27
- wait(1);
28
- with|sequential ?(.test) {
29
- $opacity = 0;
30
- wait(0.25);
31
- $opacity = 1;
32
- }
33
- a = {'b':1};
34
- with a {
35
- log(b);
36
- }
37
- </script>
38
26
  </body>
39
27
  </html>