@reveldigital/player-client 1.0.15 → 2.0.2
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/README.md +236 -236
- package/esm2022/lib/app-init.service.mjs +113 -0
- package/esm2022/lib/interfaces/client.interface.mjs +2 -0
- package/esm2022/lib/interfaces/command.interface.mjs +2 -0
- package/esm2022/lib/interfaces/config.interface.mjs +50 -0
- package/esm2022/lib/interfaces/device.interface.mjs +2 -0
- package/esm2022/lib/interfaces/event-properties.interface.mjs +2 -0
- package/esm2022/lib/interfaces/location.interface.mjs +2 -0
- package/esm2022/lib/player-client.module.mjs +71 -0
- package/esm2022/lib/player-client.service.mjs +928 -0
- package/esm2022/lib/safe-style.pipe.mjs +41 -0
- package/{esm2020 → esm2022}/lib/version.mjs +3 -3
- package/{esm2020 → esm2022}/public-api.mjs +6 -6
- package/{esm2020 → esm2022}/reveldigital-player-client.mjs +4 -4
- package/{fesm2020 → fesm2022}/reveldigital-player-client.mjs +1132 -1134
- package/fesm2022/reveldigital-player-client.mjs.map +1 -0
- package/{reveldigital-player-client.d.ts → index.d.ts} +5 -5
- package/lib/app-init.service.d.ts +18 -18
- package/lib/app-init.service.d.ts.map +1 -1
- package/lib/interfaces/client.interface.d.ts +406 -406
- package/lib/interfaces/command.interface.d.ts +78 -78
- package/lib/interfaces/config.interface.d.ts +151 -151
- package/lib/interfaces/device.interface.d.ts +139 -139
- package/lib/interfaces/event-properties.interface.d.ts +134 -134
- package/lib/interfaces/location.interface.d.ts +187 -187
- package/lib/player-client.module.d.ts +9 -9
- package/lib/player-client.service.d.ts +640 -640
- package/lib/safe-style.pipe.d.ts +23 -23
- package/lib/safe-style.pipe.d.ts.map +1 -1
- package/lib/version.d.ts +1 -1
- package/lib/version.d.ts.map +1 -1
- package/package.json +12 -18
- package/public-api.d.ts +3 -3
- package/schematics/collection.json +15 -15
- package/schematics/ng-add/assets/gadget.yaml +54 -54
- package/schematics/ng-add/index.d.ts +18 -4
- package/schematics/ng-add/index.js +391 -287
- package/schematics/ng-add/index.js.map +1 -1
- package/schematics/ng-add/schema.d.ts +4 -4
- package/schematics/ng-add/schema.js +2 -2
- package/schematics/ng-add/schema.json +23 -23
- package/schematics/ng-add/templates/index.html +30 -30
- package/schematics/ng-add/templates/polyfills.ts +72 -72
- package/schematics/ng-add/utils/changeBasePath.js +19 -19
- package/schematics/ng-add/utils/yml2xml.js +132 -132
- package/esm2020/lib/app-init.service.mjs +0 -110
- package/esm2020/lib/interfaces/client.interface.mjs +0 -2
- package/esm2020/lib/interfaces/command.interface.mjs +0 -2
- package/esm2020/lib/interfaces/config.interface.mjs +0 -50
- package/esm2020/lib/interfaces/device.interface.mjs +0 -2
- package/esm2020/lib/interfaces/event-properties.interface.mjs +0 -2
- package/esm2020/lib/interfaces/location.interface.mjs +0 -2
- package/esm2020/lib/player-client.module.mjs +0 -73
- package/esm2020/lib/player-client.service.mjs +0 -928
- package/esm2020/lib/safe-style.pipe.mjs +0 -40
- package/fesm2015/reveldigital-player-client.mjs +0 -1219
- package/fesm2015/reveldigital-player-client.mjs.map +0 -1
- package/fesm2020/reveldigital-player-client.mjs.map +0 -1
package/README.md
CHANGED
|
@@ -1,236 +1,236 @@
|
|
|
1
|
-
# Revel Digital gadget library for Angular
|
|
2
|
-
|
|
3
|
-
Angular library for building custom Revel Digital gadgets. This library simplies the player/gadget interface making it easier
|
|
4
|
-
to build full featured gadgets utilizing the Angular framework.
|
|
5
|
-
|
|
6
|
-
## Quickstart
|
|
7
|
-
|
|
8
|
-
**New to Angular?** [Check out the Angular documentation](https://angular.io/guide/setup-local) for getting your environment configured for development.
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
### **Step 1.** GitHub Repository Creation (Optional)
|
|
12
|
-
|
|
13
|
-
**Not hosting your app on Github? Skip to step #2.**
|
|
14
|
-
|
|
15
|
-
Create a new repository on [GitHub.com](https://github.com/). For more information, see "[Creating a new repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/creating-a-new-repository)."
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
Copy your remote repository URL
|
|
19
|
-
|
|
20
|
-

|
|
21
|
-
|
|
22
|
-
```sh
|
|
23
|
-
git remote add origin <REMOTE_URL>
|
|
24
|
-
# Sets the new remote
|
|
25
|
-
git remote -v
|
|
26
|
-
# Verifies the new remote URL
|
|
27
|
-
```
|
|
28
|
-
|
|
29
|
-
### **Step 2.** Create a new Angular app
|
|
30
|
-
|
|
31
|
-
From within your working folder, run the following Angular CLI command using the name of your app.
|
|
32
|
-
|
|
33
|
-
```sh
|
|
34
|
-
ng new my-app --directory ./
|
|
35
|
-
# Generates the boilerplate code for a new Angular app
|
|
36
|
-
```
|
|
37
|
-
|
|
38
|
-
### **Step 3.** Add the Revel Digital libaries
|
|
39
|
-
|
|
40
|
-
Run the Revel Digital angular schematic which will configure your app for use as a Revel Digital gadget.
|
|
41
|
-
|
|
42
|
-
```sh
|
|
43
|
-
ng add @reveldigital/player-client@latest
|
|
44
|
-
# Run the Revel Digital Angular schematic
|
|
45
|
-
```
|
|
46
|
-
|
|
47
|
-
### **Step 4.** Build
|
|
48
|
-
|
|
49
|
-
The build script will generate the Angular app along with a the gadget XML definition file.
|
|
50
|
-
|
|
51
|
-
```sh
|
|
52
|
-
npm run build:gadget
|
|
53
|
-
# Run the gadget build script
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
### **Step 5.** Deploy
|
|
57
|
-
|
|
58
|
-
The app can be hosted using any number of hosting services, however the provided schematic includes a simplified option for publishing to [GitHub Pages](https://pages.github.com/).
|
|
59
|
-
|
|
60
|
-
Assuming your working folder is associated with your GitHub repository, simply run the following command to deploy the app to the `gh-pages` branch. The gadget app and associated XML file will be publicly visibile and available for use in your signage.
|
|
61
|
-
|
|
62
|
-
```sh
|
|
63
|
-
npm run deploy:gadget
|
|
64
|
-
# Deploy to GitHub Pages
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
## Sample usage
|
|
68
|
-
|
|
69
|
-
The majority of the functionality is contained within the [PlayerClientService](https://reveldigital.github.io/reveldigital-client-library/injectables/PlayerClientService.html). The service and supporting library exposes the following functionality:
|
|
70
|
-
|
|
71
|
-
- Methods for obtaining player details such as device time, locale, etc
|
|
72
|
-
- Methods for interfacting with the player including sending commands and calling into player scripting
|
|
73
|
-
- Player lifecycle methods (ready/start/stop)
|
|
74
|
-
- Gadget property accessors such as user preferences
|
|
75
|
-
- Miscellaneous helpers such as the SafeStyle pipe
|
|
76
|
-
|
|
77
|
-
Simply inject this service in your Angular component constructor in order to access the player client interface.
|
|
78
|
-
|
|
79
|
-
```ts
|
|
80
|
-
constructor(public client: PlayerClientService) {
|
|
81
|
-
|
|
82
|
-
this.prefs = client.getPrefs();
|
|
83
|
-
|
|
84
|
-
this.style = this.prefs.getString('myStylePref');
|
|
85
|
-
|
|
86
|
-
this.client.onReady$.subscribe((val) => {
|
|
87
|
-
console.log(val ? 'Ready' : 'Not ready');
|
|
88
|
-
});
|
|
89
|
-
|
|
90
|
-
this.client.onCommand$.subscribe((cmd) => {
|
|
91
|
-
console.log(`onCommand: ${cmd.name}, ${cmd.arg}`);
|
|
92
|
-
});
|
|
93
|
-
|
|
94
|
-
this.client.onStart$.subscribe(() => {
|
|
95
|
-
console.log("onStart");
|
|
96
|
-
});
|
|
97
|
-
|
|
98
|
-
this.client.onStop$.subscribe(() => {
|
|
99
|
-
console.log("onStop");
|
|
100
|
-
});
|
|
101
|
-
}
|
|
102
|
-
```
|
|
103
|
-
|
|
104
|
-
## Gadget Definition & Preferences
|
|
105
|
-
|
|
106
|
-
The `assets/gadget.yaml` file is the definition file for your gadget, responsible for defining the basic properties and features of the gadget as presented to the user. These properties include the gadget name, description, support URL, and preferences. A sample `gadgets.yaml` file is included in your project after running the schematic.
|
|
107
|
-
|
|
108
|
-
Preferences are the primary method for providing customization options of your gadget. They allow signage designers to change and preview gadget properties at design time within the Revel Digital CMS.
|
|
109
|
-
|
|
110
|
-
The following is the sample `gadgets.yaml` included with the schematic:
|
|
111
|
-
|
|
112
|
-
```yaml
|
|
113
|
-
# Basic properties of the gadget must include the following:
|
|
114
|
-
# title: Title of the gadget as it will appear in the Revel Digital CMS UX
|
|
115
|
-
# title_url: Optional support URL for the gadget
|
|
116
|
-
# description: Details of the gadget. Will appear within the Revel Digital CMS
|
|
117
|
-
# author: Name of author or organization credited with developing the gadget
|
|
118
|
-
# background: (Deprecated) should always be transparent for most gadgets
|
|
119
|
-
#
|
|
120
|
-
title: My Gadget
|
|
121
|
-
title_url: https://mysupporturl.org
|
|
122
|
-
description: Describe the purpose of your gadget here
|
|
123
|
-
author: My Organization
|
|
124
|
-
background: transparent
|
|
125
|
-
|
|
126
|
-
# Requirements enable certain features of the gadget. Available options include:
|
|
127
|
-
# reveldigital (core Revel Digital features)
|
|
128
|
-
# offline (Enable service worker caching for offline support)
|
|
129
|
-
# webfont (Enable Google WebFonts for dynamic font loading)
|
|
130
|
-
# moment (Enable the moment library for localized date/time, initialized with device timezone)
|
|
131
|
-
# jquery (Enable the jQuery libary)
|
|
132
|
-
#
|
|
133
|
-
requirements:
|
|
134
|
-
- reveldigital
|
|
135
|
-
- offline
|
|
136
|
-
- webfont
|
|
137
|
-
- moment
|
|
138
|
-
- jquery
|
|
139
|
-
|
|
140
|
-
# Locales are use for localization within the gadget definition (XML) itself.
|
|
141
|
-
# Docs for using the Gadget API for i18n are available here: https://developers.google.com/gadgets/docs/i18n
|
|
142
|
-
#
|
|
143
|
-
# Angular applications should use the i18n support provided by the Angular framework:
|
|
144
|
-
# https://angular.io/guide/i18n-overview
|
|
145
|
-
#
|
|
146
|
-
locales:
|
|
147
|
-
- messages: https://reveldigital.github.io/reveldigital-gadgets/ALL_ALL.xml
|
|
148
|
-
|
|
149
|
-
- lang: fr
|
|
150
|
-
messages: https://reveldigital.github.io/reveldigital-gadgets/ALL_ALL.xml
|
|
151
|
-
|
|
152
|
-
# Preferences provide customization options for the gadget and are accessible at both design time and runtime.
|
|
153
|
-
#
|
|
154
|
-
# Propreties of a preference include:
|
|
155
|
-
# name: Unique name or ID for the preference
|
|
156
|
-
# display_name: Name as shown in the UX
|
|
157
|
-
# datatype: string, enum, hidden, bool, style, list
|
|
158
|
-
# default_value: Default value
|
|
159
|
-
# required: Make this prefence mandatory, must have a value
|
|
160
|
-
# multiple: Allows for multiple selection of list items (enum pref type only)
|
|
161
|
-
# multiline: Enables multiline text (string pref type only)
|
|
162
|
-
# depends: The visibility of this preference depends on other preferences. This requires the name
|
|
163
|
-
# of the dependent preference along with a list of values. Condition types can include
|
|
164
|
-
# any_of, all_of, none_of. Nested depends conditions are also supported.
|
|
165
|
-
#
|
|
166
|
-
prefs:
|
|
167
|
-
- name: myStringPref
|
|
168
|
-
display_name: Sample string preference
|
|
169
|
-
datatype: string
|
|
170
|
-
default_value: test string
|
|
171
|
-
required: true
|
|
172
|
-
multiline: false
|
|
173
|
-
|
|
174
|
-
- name: myBoolPref
|
|
175
|
-
display_name: Sample boolean preference
|
|
176
|
-
datatype: bool
|
|
177
|
-
default_value: true
|
|
178
|
-
required: true
|
|
179
|
-
depends:
|
|
180
|
-
- name: myEnumPref
|
|
181
|
-
any_of:
|
|
182
|
-
- values:
|
|
183
|
-
- fast
|
|
184
|
-
|
|
185
|
-
- name: myStylePref
|
|
186
|
-
display_name: Sample style preference
|
|
187
|
-
datatype: style
|
|
188
|
-
default_value: font-family:Verdana;color:rgb(255, 255, 255);font-size:18px;
|
|
189
|
-
required: true
|
|
190
|
-
|
|
191
|
-
- name: myEnumPref
|
|
192
|
-
display_name: Sample enum preference
|
|
193
|
-
datatype: enum
|
|
194
|
-
default_value: fast
|
|
195
|
-
required: true
|
|
196
|
-
multiple: false
|
|
197
|
-
options:
|
|
198
|
-
- value: fastest
|
|
199
|
-
display_value: Fastest
|
|
200
|
-
- value: fast
|
|
201
|
-
display_value: Fast
|
|
202
|
-
- value: medium
|
|
203
|
-
display_value: Medium
|
|
204
|
-
|
|
205
|
-
- name: myListPref
|
|
206
|
-
display_name: Sample list preference
|
|
207
|
-
datatype: list
|
|
208
|
-
default_value: dog|cat
|
|
209
|
-
required: false
|
|
210
|
-
```
|
|
211
|
-
|
|
212
|
-
This definition file results in the following user experience when designing your gadget in a template:
|
|
213
|
-
|
|
214
|
-

|
|
215
|
-
|
|
216
|
-
You will see the preferences exposed in the editor which can then be modified at design time.
|
|
217
|
-
|
|
218
|
-
Individual preferences are able to be accessed in your gadget code like so:
|
|
219
|
-
|
|
220
|
-
```ts
|
|
221
|
-
this.prefs = client.getPrefs();
|
|
222
|
-
|
|
223
|
-
this.prefs.getString('myStringPref');
|
|
224
|
-
this.prefs.getBool('myBoolPref');
|
|
225
|
-
this.prefs.getFloat('myFloatPref');
|
|
226
|
-
this.prefs.getInt('myIntPref');
|
|
227
|
-
this.prefs.getArray('myListPref');
|
|
228
|
-
```
|
|
229
|
-
|
|
230
|
-
## Angular Library Documentation
|
|
231
|
-
|
|
232
|
-
NPM: [https://www.npmjs.com/package/@reveldigital/player-client](https://www.npmjs.com/package/@reveldigital/player-client)
|
|
233
|
-
|
|
234
|
-
Library documentation is available here: [https://reveldigital.github.io/reveldigital-client-library/](https://reveldigital.github.io/reveldigital-client-library/)
|
|
235
|
-
|
|
236
|
-
A sample Angular app is available in this repo under [https://github.com/RevelDigital/reveldigital-client-library/tree/master/projects/test-app](https://github.com/RevelDigital/reveldigital-client-library/tree/master/projects/test-app).
|
|
1
|
+
# Revel Digital gadget library for Angular
|
|
2
|
+
|
|
3
|
+
Angular library for building custom Revel Digital gadgets. This library simplies the player/gadget interface making it easier
|
|
4
|
+
to build full featured gadgets utilizing the Angular framework.
|
|
5
|
+
|
|
6
|
+
## Quickstart
|
|
7
|
+
|
|
8
|
+
**New to Angular?** [Check out the Angular documentation](https://angular.io/guide/setup-local) for getting your environment configured for development.
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
### **Step 1.** GitHub Repository Creation (Optional)
|
|
12
|
+
|
|
13
|
+
**Not hosting your app on Github? Skip to step #2.**
|
|
14
|
+
|
|
15
|
+
Create a new repository on [GitHub.com](https://github.com/). For more information, see "[Creating a new repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/creating-a-new-repository)."
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
Copy your remote repository URL
|
|
19
|
+
|
|
20
|
+

|
|
21
|
+
|
|
22
|
+
```sh
|
|
23
|
+
git remote add origin <REMOTE_URL>
|
|
24
|
+
# Sets the new remote
|
|
25
|
+
git remote -v
|
|
26
|
+
# Verifies the new remote URL
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
### **Step 2.** Create a new Angular app
|
|
30
|
+
|
|
31
|
+
From within your working folder, run the following Angular CLI command using the name of your app.
|
|
32
|
+
|
|
33
|
+
```sh
|
|
34
|
+
ng new my-app --directory ./
|
|
35
|
+
# Generates the boilerplate code for a new Angular app
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
### **Step 3.** Add the Revel Digital libaries
|
|
39
|
+
|
|
40
|
+
Run the Revel Digital angular schematic which will configure your app for use as a Revel Digital gadget.
|
|
41
|
+
|
|
42
|
+
```sh
|
|
43
|
+
ng add @reveldigital/player-client@latest
|
|
44
|
+
# Run the Revel Digital Angular schematic
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
### **Step 4.** Build
|
|
48
|
+
|
|
49
|
+
The build script will generate the Angular app along with a the gadget XML definition file.
|
|
50
|
+
|
|
51
|
+
```sh
|
|
52
|
+
npm run build:gadget
|
|
53
|
+
# Run the gadget build script
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
### **Step 5.** Deploy
|
|
57
|
+
|
|
58
|
+
The app can be hosted using any number of hosting services, however the provided schematic includes a simplified option for publishing to [GitHub Pages](https://pages.github.com/).
|
|
59
|
+
|
|
60
|
+
Assuming your working folder is associated with your GitHub repository, simply run the following command to deploy the app to the `gh-pages` branch. The gadget app and associated XML file will be publicly visibile and available for use in your signage.
|
|
61
|
+
|
|
62
|
+
```sh
|
|
63
|
+
npm run deploy:gadget
|
|
64
|
+
# Deploy to GitHub Pages
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
## Sample usage
|
|
68
|
+
|
|
69
|
+
The majority of the functionality is contained within the [PlayerClientService](https://reveldigital.github.io/reveldigital-client-library/injectables/PlayerClientService.html). The service and supporting library exposes the following functionality:
|
|
70
|
+
|
|
71
|
+
- Methods for obtaining player details such as device time, locale, etc
|
|
72
|
+
- Methods for interfacting with the player including sending commands and calling into player scripting
|
|
73
|
+
- Player lifecycle methods (ready/start/stop)
|
|
74
|
+
- Gadget property accessors such as user preferences
|
|
75
|
+
- Miscellaneous helpers such as the SafeStyle pipe
|
|
76
|
+
|
|
77
|
+
Simply inject this service in your Angular component constructor in order to access the player client interface.
|
|
78
|
+
|
|
79
|
+
```ts
|
|
80
|
+
constructor(public client: PlayerClientService) {
|
|
81
|
+
|
|
82
|
+
this.prefs = client.getPrefs();
|
|
83
|
+
|
|
84
|
+
this.style = this.prefs.getString('myStylePref');
|
|
85
|
+
|
|
86
|
+
this.client.onReady$.subscribe((val) => {
|
|
87
|
+
console.log(val ? 'Ready' : 'Not ready');
|
|
88
|
+
});
|
|
89
|
+
|
|
90
|
+
this.client.onCommand$.subscribe((cmd) => {
|
|
91
|
+
console.log(`onCommand: ${cmd.name}, ${cmd.arg}`);
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
this.client.onStart$.subscribe(() => {
|
|
95
|
+
console.log("onStart");
|
|
96
|
+
});
|
|
97
|
+
|
|
98
|
+
this.client.onStop$.subscribe(() => {
|
|
99
|
+
console.log("onStop");
|
|
100
|
+
});
|
|
101
|
+
}
|
|
102
|
+
```
|
|
103
|
+
|
|
104
|
+
## Gadget Definition & Preferences
|
|
105
|
+
|
|
106
|
+
The `assets/gadget.yaml` file is the definition file for your gadget, responsible for defining the basic properties and features of the gadget as presented to the user. These properties include the gadget name, description, support URL, and preferences. A sample `gadgets.yaml` file is included in your project after running the schematic.
|
|
107
|
+
|
|
108
|
+
Preferences are the primary method for providing customization options of your gadget. They allow signage designers to change and preview gadget properties at design time within the Revel Digital CMS.
|
|
109
|
+
|
|
110
|
+
The following is the sample `gadgets.yaml` included with the schematic:
|
|
111
|
+
|
|
112
|
+
```yaml
|
|
113
|
+
# Basic properties of the gadget must include the following:
|
|
114
|
+
# title: Title of the gadget as it will appear in the Revel Digital CMS UX
|
|
115
|
+
# title_url: Optional support URL for the gadget
|
|
116
|
+
# description: Details of the gadget. Will appear within the Revel Digital CMS
|
|
117
|
+
# author: Name of author or organization credited with developing the gadget
|
|
118
|
+
# background: (Deprecated) should always be transparent for most gadgets
|
|
119
|
+
#
|
|
120
|
+
title: My Gadget
|
|
121
|
+
title_url: https://mysupporturl.org
|
|
122
|
+
description: Describe the purpose of your gadget here
|
|
123
|
+
author: My Organization
|
|
124
|
+
background: transparent
|
|
125
|
+
|
|
126
|
+
# Requirements enable certain features of the gadget. Available options include:
|
|
127
|
+
# reveldigital (core Revel Digital features)
|
|
128
|
+
# offline (Enable service worker caching for offline support)
|
|
129
|
+
# webfont (Enable Google WebFonts for dynamic font loading)
|
|
130
|
+
# moment (Enable the moment library for localized date/time, initialized with device timezone)
|
|
131
|
+
# jquery (Enable the jQuery libary)
|
|
132
|
+
#
|
|
133
|
+
requirements:
|
|
134
|
+
- reveldigital
|
|
135
|
+
- offline
|
|
136
|
+
- webfont
|
|
137
|
+
- moment
|
|
138
|
+
- jquery
|
|
139
|
+
|
|
140
|
+
# Locales are use for localization within the gadget definition (XML) itself.
|
|
141
|
+
# Docs for using the Gadget API for i18n are available here: https://developers.google.com/gadgets/docs/i18n
|
|
142
|
+
#
|
|
143
|
+
# Angular applications should use the i18n support provided by the Angular framework:
|
|
144
|
+
# https://angular.io/guide/i18n-overview
|
|
145
|
+
#
|
|
146
|
+
locales:
|
|
147
|
+
- messages: https://reveldigital.github.io/reveldigital-gadgets/ALL_ALL.xml
|
|
148
|
+
|
|
149
|
+
- lang: fr
|
|
150
|
+
messages: https://reveldigital.github.io/reveldigital-gadgets/ALL_ALL.xml
|
|
151
|
+
|
|
152
|
+
# Preferences provide customization options for the gadget and are accessible at both design time and runtime.
|
|
153
|
+
#
|
|
154
|
+
# Propreties of a preference include:
|
|
155
|
+
# name: Unique name or ID for the preference
|
|
156
|
+
# display_name: Name as shown in the UX
|
|
157
|
+
# datatype: string, enum, hidden, bool, style, list
|
|
158
|
+
# default_value: Default value
|
|
159
|
+
# required: Make this prefence mandatory, must have a value
|
|
160
|
+
# multiple: Allows for multiple selection of list items (enum pref type only)
|
|
161
|
+
# multiline: Enables multiline text (string pref type only)
|
|
162
|
+
# depends: The visibility of this preference depends on other preferences. This requires the name
|
|
163
|
+
# of the dependent preference along with a list of values. Condition types can include
|
|
164
|
+
# any_of, all_of, none_of. Nested depends conditions are also supported.
|
|
165
|
+
#
|
|
166
|
+
prefs:
|
|
167
|
+
- name: myStringPref
|
|
168
|
+
display_name: Sample string preference
|
|
169
|
+
datatype: string
|
|
170
|
+
default_value: test string
|
|
171
|
+
required: true
|
|
172
|
+
multiline: false
|
|
173
|
+
|
|
174
|
+
- name: myBoolPref
|
|
175
|
+
display_name: Sample boolean preference
|
|
176
|
+
datatype: bool
|
|
177
|
+
default_value: true
|
|
178
|
+
required: true
|
|
179
|
+
depends:
|
|
180
|
+
- name: myEnumPref
|
|
181
|
+
any_of:
|
|
182
|
+
- values:
|
|
183
|
+
- fast
|
|
184
|
+
|
|
185
|
+
- name: myStylePref
|
|
186
|
+
display_name: Sample style preference
|
|
187
|
+
datatype: style
|
|
188
|
+
default_value: font-family:Verdana;color:rgb(255, 255, 255);font-size:18px;
|
|
189
|
+
required: true
|
|
190
|
+
|
|
191
|
+
- name: myEnumPref
|
|
192
|
+
display_name: Sample enum preference
|
|
193
|
+
datatype: enum
|
|
194
|
+
default_value: fast
|
|
195
|
+
required: true
|
|
196
|
+
multiple: false
|
|
197
|
+
options:
|
|
198
|
+
- value: fastest
|
|
199
|
+
display_value: Fastest
|
|
200
|
+
- value: fast
|
|
201
|
+
display_value: Fast
|
|
202
|
+
- value: medium
|
|
203
|
+
display_value: Medium
|
|
204
|
+
|
|
205
|
+
- name: myListPref
|
|
206
|
+
display_name: Sample list preference
|
|
207
|
+
datatype: list
|
|
208
|
+
default_value: dog|cat
|
|
209
|
+
required: false
|
|
210
|
+
```
|
|
211
|
+
|
|
212
|
+
This definition file results in the following user experience when designing your gadget in a template:
|
|
213
|
+
|
|
214
|
+

|
|
215
|
+
|
|
216
|
+
You will see the preferences exposed in the editor which can then be modified at design time.
|
|
217
|
+
|
|
218
|
+
Individual preferences are able to be accessed in your gadget code like so:
|
|
219
|
+
|
|
220
|
+
```ts
|
|
221
|
+
this.prefs = client.getPrefs();
|
|
222
|
+
|
|
223
|
+
this.prefs.getString('myStringPref');
|
|
224
|
+
this.prefs.getBool('myBoolPref');
|
|
225
|
+
this.prefs.getFloat('myFloatPref');
|
|
226
|
+
this.prefs.getInt('myIntPref');
|
|
227
|
+
this.prefs.getArray('myListPref');
|
|
228
|
+
```
|
|
229
|
+
|
|
230
|
+
## Angular Library Documentation
|
|
231
|
+
|
|
232
|
+
NPM: [https://www.npmjs.com/package/@reveldigital/player-client](https://www.npmjs.com/package/@reveldigital/player-client)
|
|
233
|
+
|
|
234
|
+
Library documentation is available here: [https://reveldigital.github.io/reveldigital-client-library/](https://reveldigital.github.io/reveldigital-client-library/)
|
|
235
|
+
|
|
236
|
+
A sample Angular app is available in this repo under [https://github.com/RevelDigital/reveldigital-client-library/tree/master/projects/test-app](https://github.com/RevelDigital/reveldigital-client-library/tree/master/projects/test-app).
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import { Injectable, enableProdMode, isDevMode } from '@angular/core';
|
|
2
|
+
import * as yaml from "js-yaml";
|
|
3
|
+
import * as WebFont from 'webfontloader';
|
|
4
|
+
import * as i0 from "@angular/core";
|
|
5
|
+
import * as i1 from "@angular/common/http";
|
|
6
|
+
import * as i2 from "@angular/router";
|
|
7
|
+
const isLocal = /localhost/.test(document.location.host);
|
|
8
|
+
!isLocal && enableProdMode();
|
|
9
|
+
/** @ignore */
|
|
10
|
+
export class AppInitService {
|
|
11
|
+
constructor(http, _route, _router) {
|
|
12
|
+
this.http = http;
|
|
13
|
+
this._route = _route;
|
|
14
|
+
this._router = _router;
|
|
15
|
+
}
|
|
16
|
+
init() {
|
|
17
|
+
return new Promise(async (resolve) => {
|
|
18
|
+
this.loadFonts();
|
|
19
|
+
if (isDevMode()) {
|
|
20
|
+
console.log('%cRunning in development mode', 'background-color:blue; color:yellow;');
|
|
21
|
+
/**
|
|
22
|
+
* Shim the shindig prefs functionality for dev mode
|
|
23
|
+
*/
|
|
24
|
+
window.gadgets = {
|
|
25
|
+
Prefs: class {
|
|
26
|
+
getString(key) { return this.getParameterByName(key); }
|
|
27
|
+
getArray(key) { return this.getParameterByName(key).split(','); }
|
|
28
|
+
getBool(key) { return this.getParameterByName(key) === 'true'; }
|
|
29
|
+
getCountry() { }
|
|
30
|
+
getFloat(key) { return parseFloat(this.getParameterByName(key)); }
|
|
31
|
+
getInt(key) { return parseInt(this.getParameterByName(key)); }
|
|
32
|
+
getLang() { return this.getParameterByName('lang') === '' ? 'en' : this.getParameterByName('lang'); }
|
|
33
|
+
getParameterByName(name, search = window.location.href) {
|
|
34
|
+
name = name.replace(/[\[\]]/g, '\\$&');
|
|
35
|
+
let regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'), results = regex.exec(search);
|
|
36
|
+
if (!results)
|
|
37
|
+
return '';
|
|
38
|
+
if (!results[2])
|
|
39
|
+
return '';
|
|
40
|
+
return decodeURIComponent(results[2].replace(/\+/g, ' '));
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
};
|
|
44
|
+
this.http.get('assets/gadget.yaml', {
|
|
45
|
+
responseType: 'text'
|
|
46
|
+
}).subscribe({
|
|
47
|
+
next: (data) => {
|
|
48
|
+
const doc = yaml.load(data);
|
|
49
|
+
let params = {};
|
|
50
|
+
for (const val of doc.prefs) {
|
|
51
|
+
params[val.name] = val.default_value;
|
|
52
|
+
}
|
|
53
|
+
this._router.navigate([], {
|
|
54
|
+
relativeTo: this._route,
|
|
55
|
+
queryParams: params,
|
|
56
|
+
});
|
|
57
|
+
console.log(`%cUser prefs loaded successfully`, 'background-color:blue; color:yellow;');
|
|
58
|
+
},
|
|
59
|
+
error: (err) => {
|
|
60
|
+
console.log(`%cUnable to load user preferences YAML definition file: ${err}`, 'background-color:blue; color:yellow;');
|
|
61
|
+
console.log(`%cPlease see our developer documentation for help with your app configuration: https://developer.reveldigital.com`, 'background-color:red; color:yellow;');
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
}
|
|
65
|
+
resolve();
|
|
66
|
+
});
|
|
67
|
+
}
|
|
68
|
+
getFamilyName(css) {
|
|
69
|
+
let FONT_FAMILY_REGEX = /font-family:\s*(?:['"])*['"]*(.+?)['"]*(?:['"])*\s*;/i;
|
|
70
|
+
if (FONT_FAMILY_REGEX.test(css)) {
|
|
71
|
+
var matches = css.match(FONT_FAMILY_REGEX);
|
|
72
|
+
return matches[1].split(',')[0];
|
|
73
|
+
}
|
|
74
|
+
else {
|
|
75
|
+
return '';
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
/**
|
|
79
|
+
* Loads the given font from Google Web Fonts.
|
|
80
|
+
*/
|
|
81
|
+
loadFonts() {
|
|
82
|
+
const parameters = new URLSearchParams(window.location.search);
|
|
83
|
+
parameters.forEach((val, key) => {
|
|
84
|
+
try {
|
|
85
|
+
let fontFamily = this.getFamilyName(val);
|
|
86
|
+
if (fontFamily !== '') {
|
|
87
|
+
WebFont.load({
|
|
88
|
+
google: {
|
|
89
|
+
families: [fontFamily]
|
|
90
|
+
},
|
|
91
|
+
fontactive: (familyName) => {
|
|
92
|
+
console.log(`%cActivating font: ${familyName}`, 'background-color:blue; color:yellow;');
|
|
93
|
+
},
|
|
94
|
+
fontinactive: (familyName) => {
|
|
95
|
+
console.log(`%cFont inactive: ${familyName}`, 'background-color:red; color:yellow;');
|
|
96
|
+
}
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
catch (e) {
|
|
101
|
+
}
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppInitService, deps: [{ token: i1.HttpClient }, { token: i2.ActivatedRoute }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
105
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppInitService, providedIn: 'root' }); }
|
|
106
|
+
}
|
|
107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: AppInitService, decorators: [{
|
|
108
|
+
type: Injectable,
|
|
109
|
+
args: [{
|
|
110
|
+
providedIn: 'root'
|
|
111
|
+
}]
|
|
112
|
+
}], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.ActivatedRoute }, { type: i2.Router }] });
|
|
113
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXBwLWluaXQuc2VydmljZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3JldmVsZGlnaXRhbC9wbGF5ZXItY2xpZW50L3NyYy9saWIvYXBwLWluaXQuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLGNBQWMsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHdEUsT0FBTyxLQUFLLElBQUksTUFBTSxTQUFTLENBQUM7QUFDaEMsT0FBTyxLQUFLLE9BQU8sTUFBTSxlQUFlLENBQUM7Ozs7QUFFekMsTUFBTSxPQUFPLEdBQVksV0FBVyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO0FBQ2xFLENBQUMsT0FBTyxJQUFJLGNBQWMsRUFBRSxDQUFDO0FBRzdCLGNBQWM7QUFJZCxNQUFNLE9BQU8sY0FBYztJQUV6QixZQUNTLElBQWdCLEVBQ2YsTUFBc0IsRUFDdEIsT0FBZTtRQUZoQixTQUFJLEdBQUosSUFBSSxDQUFZO1FBQ2YsV0FBTSxHQUFOLE1BQU0sQ0FBZ0I7UUFDdEIsWUFBTyxHQUFQLE9BQU8sQ0FBUTtJQUN6QixDQUFDO0lBRUQsSUFBSTtRQUVGLE9BQU8sSUFBSSxPQUFPLENBQU8sS0FBSyxFQUFFLE9BQU8sRUFBRSxFQUFFO1lBRXpDLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztZQUVqQixJQUFJLFNBQVMsRUFBRSxFQUFFLENBQUM7Z0JBQ2hCLE9BQU8sQ0FBQyxHQUFHLENBQ1QsK0JBQStCLEVBQy9CLHNDQUFzQyxDQUN2QyxDQUFDO2dCQUVGOzttQkFFRztnQkFDRyxNQUFPLENBQUMsT0FBTyxHQUFHO29CQUV0QixLQUFLLEVBQUU7d0JBQ0wsU0FBUyxDQUFDLEdBQVcsSUFBSSxPQUFPLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxHQUFHLENBQUMsQ0FBQSxDQUFDLENBQUM7d0JBRTlE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QUFPLENBQUMsRUFBRSxDQUFDO1lBQ2IsQ0FBQztRQUNILENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzsrR0EvSFUsY0FBYzttSEFBZCxjQUFjLGNBRmIsTUFBTTs7NEZBRVAsY0FBYztrQkFIMUIsVUFBVTttQkFBQztvQkFDVixVQUFVLEVBQUUsTUFBTTtpQkFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbmplY3RhYmxlLCBlbmFibGVQcm9kTW9kZSwgaXNEZXZNb2RlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBIdHRwQ2xpZW50IH0gZnJvbSBcIkBhbmd1bGFyL2NvbW1vbi9odHRwXCI7XG5pbXBvcnQgeyBBY3RpdmF0ZWRSb3V0ZSwgUm91dGVyIH0gZnJvbSBcIkBhbmd1bGFyL3JvdXRlclwiO1xuaW1wb3J0ICogYXMgeWFtbCBmcm9tIFwianMteWFtbFwiO1xuaW1wb3J0ICogYXMgV2ViRm9udCBmcm9tICd3ZWJmb250bG9hZGVyJztcblxuY29uc3QgaXNMb2NhbDogYm9vbGVhbiA9IC9sb2NhbGhvc3QvLnRlc3QoZG9jdW1lbnQubG9jYXRpb24uaG9zdCk7XG4haXNMb2NhbCAmJiBlbmFibGVQcm9kTW9kZSgpO1xuXG5cbi8qKiBAaWdub3JlICovXG5ASW5qZWN0YWJsZSh7XG4gIHByb3ZpZGVkSW46ICdyb290J1xufSlcbmV4cG9ydCBjbGFzcyBBcHBJbml0U2VydmljZSB7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHVibGljIGh0dHA6IEh0dHBDbGllbnQsXG4gICAgcHJpdmF0ZSBfcm91dGU6IEFjdGl2YXRlZFJvdXRlLFxuICAgIHByaXZhdGUgX3JvdXRlcjogUm91dGVyKSB7XG4gIH1cblxuICBpbml0KCk6IFByb21pc2U8YW55PiB7XG5cbiAgICByZXR1cm4gbmV3IFByb21pc2U8dm9pZD4oYXN5bmMgKHJlc29sdmUpID0+IHtcblxuICAgICAgdGhpcy5sb2FkRm9udHMoKTtcblxuICAgICAgaWYgKGlzRGV2TW9kZSgpKSB7XG4gICAgICAgIGNvbnNvbGUubG9nKFxuICAgICAgICAgICclY1J1bm5pbmcgaW4gZGV2ZWxvcG1lbnQgbW9kZScsXG4gICAgICAgICAgJ2JhY2tncm91bmQtY29sb3I6Ymx1ZTsgY29sb3I6eWVsbG93OydcbiAgICAgICAgKTtcblxuICAgICAgICAvKipcbiAgICAgICAgICogU2hpbSB0aGUgc2hpbmRpZyBwcmVmcyBmdW5jdGlvbmFsaXR5IGZvciBkZXYgbW9kZVxuICAgICAgICAgKi9cbiAgICAgICAgKDxhbnk+d2luZG93KS5nYWRnZXRzID0ge1xuXG4gICAgICAgICAgUHJlZnM6IGNsYXNzIHtcbiAgICAgICAgICAgIGdldFN0cmluZyhrZXk6IHN0cmluZykgeyByZXR1cm4gdGhpcy5nZXRQYXJhbWV0ZXJCeU5hbWUoa2V5KSB9XG5cbiAgICAgICAgICAgIGdldEFycmF5KGtleTogc3RyaW5nKSB7IHJldHVybiB0aGlzLmdldFBhcmFtZXRlckJ5TmFtZShrZXkpLnNwbGl0KCcsJykgfVxuXG4gICAgICAgICAgICBnZXRCb29sKGtleTogc3RyaW5nKSB7IHJldHVybiB0aGlzLmdldFBhcmFtZXRlckJ5TmFtZShrZXkpID09PSAndHJ1ZScgfVxuXG4gICAgICAgICAgICBnZXRDb3VudHJ5KCkgeyB9XG5cbiAgICAgICAgICAgIGdldEZsb2F0KGtleTogc3RyaW5nKSB7IHJldHVybiBwYXJzZUZsb2F0KHRoaXMuZ2V0UGFyYW1ldGVyQnlOYW1lKGtleSkpIH1cblxuICAgICAgICAgICAgZ2V0SW50KGtleTogc3RyaW5nKSB7IHJldHVybiBwYXJzZUludCh0aGlzLmdldFBhcmFtZXRlckJ5TmFtZShrZXkpKSB9XG5cbiAgICAgICAgICAgIGdldExhbmcoKSB7IHJldHVybiB0aGlzLmdldFBhcmFtZXRlckJ5TmFtZSgnbGFuZycpID09PSAnJyA/ICdlbicgOiB0aGlzLmdldFBhcmFtZXRlckJ5TmFtZSgnbGFuZycpOyB9XG5cbiAgICAgICAgICAgIGdldFBhcmFtZXRlckJ5TmFtZShuYW1lOiBzdHJpbmcsIHNlYXJjaCA9IHdpbmRvdy5sb2NhdGlvbi5ocmVmKTogc3RyaW5nIHtcblxuICAgICAgICAgICAgICBuYW1lID0gbmFtZS5yZXBsYWNlKC9bXFxbXFxdXS9nLCAnXFxcXCQmJyk7XG4gICAgICAgICAgICAgIGxldCByZWdleCA9IG5ldyBSZWdFeHAoJ1s/Jl0nICsgbmFtZSArICcoPShbXiYjXSopfCZ8I3wkKScpLFxuICAgICAgICAgICAgICAgIHJlc3VsdHMgPSByZWdleC5leGVjKHNlYXJjaCk7XG4gICAgICAgICAgICAgIGlmICghcmVzdWx0cykgcmV0dXJuICcnO1xuICAgICAgICAgICAgICBpZiAoIXJlc3VsdHNbMl0pIHJldHVybiAnJztcbiAgICAgICAgICAgICAgcmV0dXJuIGRlY29kZVVSSUNvbXBvbmVudChyZXN1bHRzWzJdLnJlcGxhY2UoL1xcKy9nLCAnICcpKTtcbiAgICAgICAgICAgIH1cbiAgICAgICAgICB9XG4gICAgICAgIH07XG5cbiAgICAgICAgdGhpcy5odHRwLmdldCgnYXNzZXRzL2dhZGdldC55YW1sJywge1xuICAgICAgICAgIHJlc3BvbnNlVHlwZTogJ3RleHQnXG4gICAgICAgIH0pLnN1YnNjcmliZSh7XG4gICAgICAgICAgbmV4dDogKGRhdGEpID0+IHtcbiAgICAgICAgICAgIGNvbnN0IGRvYzogYW55ID0geWFtbC5sb2FkKGRhdGEpO1xuICAgICAgICAgICAgbGV0IHBhcmFtczogYW55ID0ge31cbiAgICAgICAgICAgIGZvciAoY29uc3QgdmFsIG9mIGRvYy5wcmVmcykge1xuICAgICAgICAgICAgICBwYXJhbXNbdmFsLm5hbWVdID0gdmFsLmRlZmF1bHRfdmFsdWVcbiAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgdGhpcy5fcm91dGVyLm5hdmlnYXRlKFtdLCB7XG4gICAgICAgICAgICAgIHJlbGF0aXZlVG86IHRoaXMuX3JvdXRlLFxuICAgICAgICAgICAgICBxdWVyeVBhcmFtczogcGFyYW1zLFxuICAgICAgICAgICAgfSk7XG5cbiAgICAgICAgICAgIGNvbnNvbGUubG9nKFxuICAgICAgICAgICAgICBgJWNVc2VyIHByZWZzIGxvYWRlZCBzdWNjZXNzZnVsbHlgLFxuICAgICAgICAgICAgICAnYmFja2dyb3VuZC1jb2xvcjpibHVlOyBjb2xvcjp5ZWxsb3c7J1xuICAgICAgICAgICAgKTtcbiAgICAgICAgICB9LFxuICAgICAgICAgIGVycm9yOiAoZXJyKSA9PiB7XG4gICAgICAgICAgICBjb25zb2xlLmxvZyhcbiAgICAgICAgICAgICAgYCVjVW5hYmxlIHRvIGxvYWQgdXNlciBwcmVmZXJlbmNlcyBZQU1MIGRlZmluaXRpb24gZmlsZTogJHtlcnJ9YCxcbiAgICAgICAgICAgICAgJ2JhY2tncm91bmQtY29sb3I6Ymx1ZTsgY29sb3I6eWVsbG93OydcbiAgICAgICAgICAgICk7XG4gICAgICAgICAgICBjb25zb2xlLmxvZyhcbiAgICAgICAgICAgICAgYCVjUGxlYXNlIHNlZSBvdXIgZGV2ZWxvcGVyIGRvY3VtZW50YXRpb24gZm9yIGhlbHAgd2l0aCB5b3VyIGFwcCBjb25maWd1cmF0aW9uOiBodHRwczovL2RldmVsb3Blci5yZXZlbGRpZ2l0YWwuY29tYCxcbiAgICAgICAgICAgICAgJ2JhY2tncm91bmQtY29sb3I6cmVkOyBjb2xvcjp5ZWxsb3c7J1xuICAgICAgICAgICAgKVxuICAgICAgICAgIH1cbiAgICAgICAgfSlcbiAgICAgIH1cbiAgICAgIHJlc29sdmUoKTtcbiAgICB9KTtcbiAgfVxuXG5cbiAgcHJpdmF0ZSBnZXRGYW1pbHlOYW1lKGNzcykge1xuXG4gICAgbGV0IEZPTlRfRkFNSUxZX1JFR0VYID0gL2ZvbnQtZmFtaWx5OlxccyooPzpbJiMzOTsmIzM0O10pKlsnXCJdKiguKz8pWydcIl0qKD86WyYjMzk7JiMzNDtdKSpcXHMqOy9pO1xuICAgIGlmIChGT05UX0ZBTUlMWV9SRUdFWC50ZXN0KGNzcykpIHtcbiAgICAgIHZhciBtYXRjaGVzID0gY3NzLm1hdGNoKEZPTlRfRkFNSUxZX1JFR0VYKTtcbiAgICAgIHJldHVybiBtYXRjaGVzWzFdLnNwbGl0KCcsJylbMF07XG4gICAgfSBlbHNlIHtcbiAgICAgIHJldHVybiAnJztcbiAgICB9XG4gIH1cblxuICAvKipcbiAgICogTG9hZHMgdGhlIGdpdmVuIGZvbnQgZnJvbSBHb29nbGUgV2ViIEZvbnRzLlxuICAgKi9cbiAgcHJpdmF0ZSBsb2FkRm9udHMoKTogdm9pZCB7XG5cbiAgICBjb25zdCBwYXJhbWV0ZXJzID0gbmV3IFVSTFNlYXJjaFBhcmFtcyh3aW5kb3cubG9jYXRpb24uc2VhcmNoKTtcbiAgICBwYXJhbWV0ZXJzLmZvckVhY2goKHZhbCwga2V5KSA9PiB7XG4gICAgICB0cnkge1xuICAgICAgICBsZXQgZm9udEZhbWlseSA9IHRoaXMuZ2V0RmFtaWx5TmFtZSh2YWwpO1xuICAgICAgICBpZiAoZm9udEZhbWlseSAhPT0gJycpIHtcbiAgICAgICAgICBXZWJGb250LmxvYWQoe1xuICAgICAgICAgICAgZ29vZ2xlOiB7XG4gICAgICAgICAgICAgIGZhbWlsaWVzOiBbZm9udEZhbWlseV1cbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgICBmb250YWN0aXZlOiAoZmFtaWx5TmFtZSkgPT4ge1xuICAgICAgICAgICAgICBjb25zb2xlLmxvZyhgJWNBY3RpdmF0aW5nIGZvbnQ6ICR7ZmFtaWx5TmFtZX1gLFxuICAgICAgICAgICAgICAgICdiYWNrZ3JvdW5kLWNvbG9yOmJsdWU7IGNvbG9yOnllbGxvdzsnKTtcbiAgICAgICAgICAgIH0sXG4gICAgICAgICAgICBmb250aW5hY3RpdmU6IChmYW1pbHlOYW1lKSA9PiB7XG4gICAgICAgICAgICAgIGNvbnNvbGUubG9nKGAlY0ZvbnQgaW5hY3RpdmU6ICR7ZmFtaWx5TmFtZX1gLFxuICAgICAgICAgICAgICAgICdiYWNrZ3JvdW5kLWNvbG9yOnJlZDsgY29sb3I6eWVsbG93OycpO1xuICAgICAgICAgICAgfVxuICAgICAgICAgIH0pO1xuICAgICAgICB9XG4gICAgICB9IGNhdGNoIChlKSB7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cbn1cbiJdfQ==
|