vsn 0.1.121 → 0.1.123

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.
package/demo/demo.html CHANGED
@@ -82,39 +82,6 @@
82
82
  </head>
83
83
  <body>
84
84
 
85
- <template vsn-component:test-component>
86
- <script vsn-script type="text/vsn">
87
- class test-component {
88
- class .test-class {
89
- func construct() {
90
- log('hmm?');
91
- $color = "#ff00ff";
92
- }
93
- class button {
94
- func construct() {
95
- $color = "#ff00ff";
96
- }
97
-
98
- on click() {
99
- log(@class);
100
- @class -= 'test-class';
101
- @class ~ 'huh';
102
- log(@class);
103
- }
104
- }
105
- }
106
- }
107
- </script>
108
- <div class="test-class">
109
- <h1>Test Component</h1>
110
- <p>
111
- <button>Click Me</button>
112
- </p>
113
- </div>
114
- </template>
115
-
116
- <test-component></test-component>
117
-
118
85
  <template vsn-template id="vsn-template">
119
86
  <span>Hello, world!</span>
120
87
  </template>
@@ -237,7 +204,7 @@
237
204
  </div>
238
205
 
239
206
  <h2>Lazy XHR Component</h2>
240
- <div vsn-lazy="@html = << './xhr.html'"></div>
207
+ <div vsn-lazy="@html = << './resources/xhr-lazy.html'"></div>
241
208
 
242
209
  <script type="text/javascript">
243
210
  window.addEventListener('vsn', function () {
@@ -15,17 +15,21 @@
15
15
 
16
16
  <test-component>
17
17
  <button slot="cta" type="button">Component Two <strong vsn-bind="data.count"></strong></button>
18
- <h1 slot="display">Hihi <span vsn-if="options.testing">worky</span></h1>
18
+ <h1 slot="display">Hihi <span vsn-if="options.testing">comp 2</span></h1>
19
19
  </test-component>
20
20
  </div>
21
21
  <script type="text/javascript" src="../vsn.js"></script>
22
22
 
23
23
  <template vsn-component:test-component>
24
+
24
25
  <div vsn-scope:data="{'count': -1}">
25
26
  <slot name="cta" vsn-on:click="data.count += 1; log(data.count);"></slot>
26
27
  <slot name="display" vsn-if="data.count > 5"></slot>
27
28
  <button vsn-on:click="options.testing = !options.testing; log(options.testing);" type="button">Toggle</button>
28
29
  </div>
30
+ <script type="text/vsn" vsn-script>
31
+ log(this);
32
+ </script>
29
33
  </template>
30
34
  </body>
31
35
  </html>
@@ -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,34 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>VSN Named Stack Demo</title>
6
+ </head>
7
+ <style>
8
+ h1 {
9
+ transition: all 0.5s;
10
+ }
11
+ </style>
12
+ <script type="text/vsn" vsn-script|defer>
13
+ class h1 {
14
+ on click() {
15
+ stack clicky {
16
+ @text = 'big';
17
+ $font-size = '120%';
18
+ $color = 'black';
19
+ wait(1);
20
+ @text = 'small';
21
+ $font-size = '100%';
22
+ $color = 'red';
23
+ wait(1);
24
+ }
25
+ }
26
+ }
27
+ </script>
28
+ <body>
29
+
30
+ <h1 id="clicky">Click Me</h1>
31
+
32
+ <script type="text/javascript" src="vsn.js"></script>
33
+ </body>
34
+ </html>
@@ -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,26 @@
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
+ }
27
41
  }
28
42
  }
29
43
  </script>
30
- <div class="simple"><input type="text" /></div>
44
+ <div class="simple">
45
+ <label>Simple Input</label>
46
+ <input type="text" />
47
+ </div>
31
48
  <div class="simple"><input type="button" /></div>
32
49
  <button vsn-on:click="?(.simple)[0].@class -= 'simple'">Remove</button>
33
50
  </div>