ahdjs 0.0.7 → 0.0.9

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.
@@ -1,9 +1,14 @@
1
1
  import "./index.scss";
2
2
  declare class AHDjs {
3
3
  private guideChimp;
4
- constructor(...args: any);
4
+ private appId;
5
+ private contextToursMapData;
6
+ constructor(applicationId: any, tour: any, options: any);
7
+ updatePageUrl: (url: string, refetch: boolean) => Promise<void>;
8
+ setTour: (tour: any) => void;
5
9
  beacons: (...args: any) => void;
6
10
  start: (...args: any) => void;
11
+ stop: (...args: any) => Promise<void>;
7
12
  showInformation: (...args: any) => void;
8
13
  }
9
14
  export default AHDjs;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ahdjs",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "description": "",
5
5
  "main": "build/index.js",
6
6
  "types": "build/types/index.d.ts",
package/testing.html CHANGED
@@ -2,201 +2,225 @@
2
2
  <head>
3
3
  <link rel="stylesheet" href="./build/css/index.css" />
4
4
  <script type="text/javascript" src="/build/index.js"></script>
5
-
5
+
6
6
  <body>
7
- <div class="tour-container">
8
- User input: <input id="user-input">
9
- <br><br>
10
- <div id="try-and-buy" class="tour-section">Try & Buy</div>
11
- <div id="subscription" class="tour-section">Subscription</div>
12
- <div id="pricing-table" class="tour-section">Pricing Table</div>
13
- <div id="multi-feature" class="tour-section">Multi-Feature</div>
14
- <div id="node-locked" class="tour-section">Node-Locked</div>
15
- <div id="pay-per-use" class="tour-section">Pay-per-Use</div>
16
- </div>
17
- <script>
18
- const tour = [
19
- {
7
+ <div class="tour-container">
8
+ User input: <input id="user-input" /> <br /><br />
9
+ <div id="try-and-buy" class="tour-section">Try & Buy</div>
10
+ <div id="subscription" class="tour-section">Subscription</div>
11
+ <div id="pricing-table" class="tour-section" data-ahd="heading">
12
+ Pricing Table
13
+ </div>
14
+ <div id="multi-feature" class="tour-section">Multi-Feature</div>
15
+ <div id="node-locked" class="tour-section" data-ahd="widget-video">
16
+ Node-Locked
17
+ </div>
18
+ <div id="pay-per-use" class="tour-section">Pay-per-Use</div>
19
+ </div>
20
+ <script>
21
+ const tour1 = [
22
+ {
23
+ element: "#user-input",
24
+ title: "Try & Buy",
25
+ description:
26
+ "Move to the next step is only possible if user input provided.",
27
+ },
28
+ ];
29
+ const tour = [
30
+ {
31
+ element: "#user-input",
32
+ title: "Try & Buy",
33
+ description:
34
+ "Move to the next step is only possible if user input provided.<iframe src='https://www.youtube.com/embed/k9xnxvujdBw?controls=0' />",
35
+
36
+ triggers: {
37
+ next: {
20
38
  element: "#user-input",
21
- title: "Try & Buy",
22
- description:
23
- "Move to the next step is only possible if user input provided.<iframe src='https://www.youtube.com/embed/k9xnxvujdBw?controls=0' />",
24
-
25
- triggers: {
26
- next: {
27
- element: "#user-input",
28
- event: "change",
29
- listener(e) {
30
- if (e.target.value) {
31
- alert('User input: "' + e.target.value + '"');
32
- this.next();
33
- }
34
- },
35
- },
39
+ event: "change",
40
+ listener(e) {
41
+ if (e.target.value) {
42
+ alert('User input: "' + e.target.value + '"');
43
+ this.next();
44
+ }
36
45
  },
37
46
  },
47
+ },
48
+ },
49
+ {
50
+ element: "#subscription",
51
+ title: "Subscription",
52
+ description:
53
+ "Subscription licensing model allows user to enable product for a specific period of time, with the possibility of the subscription renewal.",
54
+ buttons: [
38
55
  {
39
- element: "#subscription",
40
- title: "Subscription",
41
- description:
42
- "Subscription licensing model allows user to enable product for a specific period of time, with the possibility of the subscription renewal.",
43
- buttons: [
44
- {
45
- title: "See more",
46
- class: "tour-button",
47
- onClick: function () {
48
- alert("Step button click");
49
- },
50
- },
51
- ],
52
- },
53
- {
54
- element: "#pricing-table",
55
- title: "Pricing Table",
56
- description:
57
- "Price and package in minutes without having to re-code or re-engineer back-office systems.",
58
- buttons: [
59
- {
60
- title: "See more",
61
- class: "tour-button",
62
- onClick: function () {
63
- alert("Step button click");
64
- },
65
- },
66
- ],
67
- },
68
- {
69
- element: "#multi-feature",
70
- title: "Multi Feature",
71
- description:
72
- "This licensing model allows enabling or disabling product features on the users needs and budget. It may be used to create an upgrade path from a “lite” version to “standard,” “pro,” “enterprise” etc. versions without modifying the software or uninstalling the existing version.",
73
- buttons: [
74
- {
75
- title: "See more",
76
- class: "tour-button",
77
- onClick: function () {
78
- alert("Step button click");
79
- },
80
- },
81
- ],
56
+ title: "See more",
57
+ class: "tour-button",
58
+ onClick: function () {
59
+ alert("Step button click");
60
+ },
82
61
  },
62
+ ],
63
+ },
64
+ {
65
+ element: "#pricing-table",
66
+ title: "Pricing Table",
67
+ description:
68
+ "Price and package in minutes without having to re-code or re-engineer back-office systems.",
69
+ buttons: [
83
70
  {
84
- element: "#node-locked",
85
- title: "Node-Locked",
86
- description:
87
- "Software is licensed for use only on one or more named computer systems. Usually, CPU serial number verification is used to enforce this type of license.",
88
- buttons: [
89
- {
90
- title: "See more",
91
- class: "tour-button",
92
- onClick: function () {
93
- alert("Step button click");
94
- },
95
- },
96
- ],
71
+ title: "See more",
72
+ class: "tour-button",
73
+ onClick: function () {
74
+ alert("Step button click");
75
+ },
97
76
  },
77
+ ],
78
+ },
79
+ {
80
+ element: "#multi-feature",
81
+ title: "Multi Feature",
82
+ description:
83
+ "This licensing model allows enabling or disabling product features on the users needs and budget. It may be used to create an upgrade path from a “lite” version to “standard,” “pro,” “enterprise” etc. versions without modifying the software or uninstalling the existing version.",
84
+ buttons: [
98
85
  {
99
- element: "#pay-per-use",
100
- title: "Pay-per-Use",
101
- description:
102
- "Limits the quantity of the license uses, in addition to the license validity. License fees are based on the actual usage.",
103
- buttons: [
104
- {
105
- title: "See more",
106
- class: "tour-button",
107
- onClick: function () {
108
- alert("Step button click");
109
- },
110
- },
111
- ],
86
+ title: "See more",
87
+ class: "tour-button",
88
+ onClick: function () {
89
+ alert("Step button click");
90
+ },
112
91
  },
113
- ];
114
- let beacons = [
92
+ ],
93
+ },
94
+ {
95
+ element: "#node-locked",
96
+ title: "Node-Locked",
97
+ description:
98
+ "Software is licensed for use only on one or more named computer systems. Usually, CPU serial number verification is used to enforce this type of license.",
99
+ buttons: [
115
100
  {
116
- element: "#user-input",
117
- position: "top",
118
- boundary: "outer",
119
- class: "beacon-labs64",
120
- tour: tour,
101
+ title: "See more",
102
+ class: "tour-button",
103
+ onClick: function () {
104
+ alert("Step button click");
105
+ },
121
106
  },
107
+ ],
108
+ },
109
+ {
110
+ element: "#pay-per-use",
111
+ title: "Pay-per-Use",
112
+ description:
113
+ "Limits the quantity of the license uses, in addition to the license validity. License fees are based on the actual usage.",
114
+ buttons: [
122
115
  {
123
- element: "#try-and-buy",
124
- position: "top-left",
125
- class: "beacon-green",
126
- onClick() {
127
- alert("Beacon clicked");
116
+ title: "See more",
117
+ class: "tour-button",
118
+ onClick: function () {
119
+ alert("Step button click");
128
120
  },
129
121
  },
122
+ ],
123
+ },
124
+ ];
125
+ let beacons = [
126
+ {
127
+ element: "#user-input",
128
+ position: "top",
129
+ boundary: "outer",
130
+ class: "beacon-labs64",
131
+ tour: tour,
132
+ },
133
+ {
134
+ element: "#try-and-buy",
135
+ position: "top-left",
136
+ class: "beacon-green",
137
+ onClick() {
138
+ alert("Beacon clicked");
139
+ },
140
+ },
141
+ {
142
+ element: "#pricing-table",
143
+ position: "top-right",
144
+ canShow: function () {
145
+ // Load the video
146
+ // const videoPlayer = document.createElement("iframe");
147
+ // videoPlayer.src =
148
+ // "https://www.youtube.com/embed/k9xnxvujdBw?controls=0";
149
+ // videoPlayer.allowFullscreen = true;
150
+ // videoPlayer.classList.add("video-player");
151
+ // const tourContainer = document.querySelector("#pricing-table");
152
+ // tourContainer.appendChild(videoPlayer);
153
+ },
154
+ tour: [
130
155
  {
131
- element: "#pricing-table",
132
- position: "top-right",
156
+ title: "Pricing Table",
157
+ description: "Pricing Table beacon clicked.",
158
+ class: "not-price",
159
+ buttons: [],
133
160
  canShow: function () {
134
161
  // Load the video
135
- // const videoPlayer = document.createElement("iframe");
136
- // videoPlayer.src =
137
- // "https://www.youtube.com/embed/k9xnxvujdBw?controls=0";
138
- // videoPlayer.allowFullscreen = true;
139
- // videoPlayer.classList.add("video-player");
140
- // const tourContainer = document.querySelector("#pricing-table");
141
- // tourContainer.appendChild(videoPlayer);
162
+ const videoPlayer = document.createElement("iframe");
163
+ videoPlayer.src = `${data?.video[0]?.publicUrl}`;
164
+ videoPlayer.allowFullscreen = true;
165
+ videoPlayer.classList.add("video-player");
166
+ const tourContainer =
167
+ document.querySelector("#pricing-table");
168
+ tourContainer.appendChild(videoPlayer);
142
169
  },
143
- tour: [
144
- {
145
- title: "Pricing Table",
146
- description: "Pricing Table beacon clicked.",
147
- class: "not-price",
148
- buttons: [],
149
- canShow: function () {
150
- // Load the video
151
- const videoPlayer = document.createElement("iframe");
152
- videoPlayer.src = `${data?.video[0]?.publicUrl}`;
153
- videoPlayer.allowFullscreen = true;
154
- videoPlayer.classList.add("video-player");
155
- const tourContainer = document.querySelector("#pricing-table");
156
- tourContainer.appendChild(videoPlayer);
157
- },
158
- },
159
- ],
160
170
  },
171
+ ],
172
+ },
173
+ {
174
+ element: "#multi-feature",
175
+ position: "bottom-left",
176
+ boundary: "inner",
177
+ class: "beacon-white",
178
+ tour: [
161
179
  {
162
- element: "#multi-feature",
163
- position: "bottom-left",
164
- boundary: "inner",
165
- class: "beacon-white",
166
- tour: [
167
- {
168
- title: "Multi Feature",
169
- description: "Multi Feature beacon clicked.",
170
- },
171
- ],
180
+ title: "Multi Feature",
181
+ description: "Multi Feature beacon clicked.",
172
182
  },
173
- {
174
- element: "#pay-per-use",
175
- position: "center",
176
- class: "beacon-black",
177
- tour: {
178
- steps: [
179
- {
180
- element: "#pay-per-use",
181
- title: "Pay-per-Use",
182
- description: "Pay-per-Use beacon clicked.",
183
- },
184
- ],
185
- options: {
186
- position: "top",
187
- },
188
- },
189
- canShow() {
190
- return true;
183
+ ],
184
+ },
185
+ {
186
+ element: "#pay-per-use",
187
+ position: "center",
188
+ class: "beacon-black",
189
+ tour: {
190
+ steps: [
191
+ {
192
+ element: "#pay-per-use",
193
+ title: "Pay-per-Use",
194
+ description: "Pay-per-Use beacon clicked.",
191
195
  },
196
+ ],
197
+ options: {
198
+ position: "top",
192
199
  },
193
- ];
194
- const AHDjs = window.AHDjs.default;
195
- const _ahdJs = new AHDjs(tour);
196
- // _ahdJs.beacons(beacons);
197
- // _ahdJs.showInformation(beacons);
198
- _ahdJs.start();
199
- </script>
200
+ },
201
+ canShow() {
202
+ return true;
203
+ },
204
+ },
205
+ ];
206
+ const AHDjs = window.AHDjs.default;
207
+ let _ahdJs = new AHDjs("6336128a251dcbda38bd8fe1");
208
+ // _ahdJs.beacons(beacons);
209
+ // _ahdJs.showInformation(beacons);
210
+ debugger;
211
+ _ahdJs.updatePageUrl("/testing.html");
212
+ // _ahdJs.start();
213
+ setTimeout(() => {
214
+ // _ahdJs.updatePageUrl("/testing.html");
215
+ _ahdJs.beacons();
216
+ }, 10000);
217
+ // setTimeout(async () => {
218
+ // await _ahdJs.stop();
219
+ // debugger;
220
+ // _ahdJs.setTour(tour);
221
+ // _ahdJs.start();
222
+ // }, 15000);
223
+ </script>
200
224
  </body>
201
225
  </head>
202
226
  </html>