ahdjs 0.0.6 → 0.0.7
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/build/css/index.css +1 -1
- package/build/css/index.css.map +1 -1
- package/build/index.js +2 -2
- package/build/index.js.map +1 -1
- package/build/types/index.d.ts +2 -2
- package/package.json +1 -1
- package/testing.html +202 -0
package/build/types/index.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import "./index.scss";
|
|
2
|
-
declare class
|
|
2
|
+
declare class AHDjs {
|
|
3
3
|
private guideChimp;
|
|
4
4
|
constructor(...args: any);
|
|
5
5
|
beacons: (...args: any) => void;
|
|
6
6
|
start: (...args: any) => void;
|
|
7
7
|
showInformation: (...args: any) => void;
|
|
8
8
|
}
|
|
9
|
-
export default
|
|
9
|
+
export default AHDjs;
|
package/package.json
CHANGED
package/testing.html
ADDED
|
@@ -0,0 +1,202 @@
|
|
|
1
|
+
<html>
|
|
2
|
+
<head>
|
|
3
|
+
<link rel="stylesheet" href="./build/css/index.css" />
|
|
4
|
+
<script type="text/javascript" src="/build/index.js"></script>
|
|
5
|
+
|
|
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
|
+
{
|
|
20
|
+
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
|
+
},
|
|
36
|
+
},
|
|
37
|
+
},
|
|
38
|
+
{
|
|
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
|
+
],
|
|
82
|
+
},
|
|
83
|
+
{
|
|
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
|
+
],
|
|
97
|
+
},
|
|
98
|
+
{
|
|
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
|
+
],
|
|
112
|
+
},
|
|
113
|
+
];
|
|
114
|
+
let beacons = [
|
|
115
|
+
{
|
|
116
|
+
element: "#user-input",
|
|
117
|
+
position: "top",
|
|
118
|
+
boundary: "outer",
|
|
119
|
+
class: "beacon-labs64",
|
|
120
|
+
tour: tour,
|
|
121
|
+
},
|
|
122
|
+
{
|
|
123
|
+
element: "#try-and-buy",
|
|
124
|
+
position: "top-left",
|
|
125
|
+
class: "beacon-green",
|
|
126
|
+
onClick() {
|
|
127
|
+
alert("Beacon clicked");
|
|
128
|
+
},
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
element: "#pricing-table",
|
|
132
|
+
position: "top-right",
|
|
133
|
+
canShow: function () {
|
|
134
|
+
// 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);
|
|
142
|
+
},
|
|
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
|
+
},
|
|
161
|
+
{
|
|
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
|
+
],
|
|
172
|
+
},
|
|
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;
|
|
191
|
+
},
|
|
192
|
+
},
|
|
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
|
+
</body>
|
|
201
|
+
</head>
|
|
202
|
+
</html>
|