@storyteq/platform-integration 1.0.5 → 1.0.8

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 CHANGED
@@ -22,17 +22,18 @@ npm i @storyteq/platform-integration
22
22
  ```
23
23
  import * as StoryteqPlatform from '@storyteq/platform-integration';
24
24
  ```
25
+
25
26
  ### General usage
26
27
 
27
28
  It's important to note that the iframe's dimensions are determined by the parent's dimensions, so usually you need to make sure there's always a height for `#element-to-spawn-into`.
28
29
 
29
30
  Each page's instance provides the following methods;
30
31
 
31
- __on(event: String, callback: Function)__
32
+ **on(event: String, callback: Function)**
32
33
 
33
34
  Depending on the context, the callback can contain different or no arguments.
34
35
 
35
- __destroy()__
36
+ **destroy()**
36
37
 
37
38
  Destroy the currently active page instance.
38
39
 
@@ -44,7 +45,8 @@ In order for the generated iframe to load correctly, your domains need to be whi
44
45
 
45
46
  ### Create media form
46
47
 
47
- __Usage example__
48
+ **Usage example**
49
+
48
50
  ```js
49
51
  const createMediaPage = new StoryteqPlatform.createMediaPage(
50
52
  '#element-to-spawn-into',
@@ -70,24 +72,25 @@ createMediaPage
70
72
 
71
73
  ### CRM Analytics page
72
74
 
73
- __Usage example__
75
+ **Usage example**
76
+
74
77
  ```js
75
78
  const crmAnalyticsPage = new StoryteqPlatform.crmAnalyticsPage(
76
79
  '#element-to-spawn-into',
77
80
  'AUTH_TOKEN',
78
81
  1000, // template ID,
79
- 1000, // campaign ID,
82
+ 1000 // campaign ID,
80
83
  );
81
84
 
82
- crmAnalyticsPage
83
- .on('loaded', () => console.log('loaded'));
85
+ crmAnalyticsPage.on('loaded', () => console.log('loaded'));
84
86
  ```
85
87
 
86
88
  ## Create Media form Advanced Configuration Options / UI customization
87
89
 
88
90
  The integration supports additional configuration options that allows you to customize the media creation UI/UX.
89
91
 
90
- __Advanced Configuration Example__
92
+ **Advanced Configuration Example**
93
+
91
94
  ```js
92
95
  const createMediaPage = new StoryteqPlatform.createMediaPage(
93
96
  '#element-to-spawn-into',
@@ -106,6 +109,9 @@ const createMediaPage = new StoryteqPlatform.createMediaPage(
106
109
  // creationType: 'batch', // if left empty, it will default to single media create form
107
110
  ui: {
108
111
  forceMediaPreviewBeforeCreate: 'always',
112
+ theme: {
113
+ primaryColor: '#33bc2c',
114
+ },
109
115
  customizationItems: [
110
116
  {
111
117
  item: 'host_product_name',
@@ -134,7 +140,7 @@ const createMediaPage = new StoryteqPlatform.createMediaPage(
134
140
  {
135
141
  item: 'full_screen',
136
142
  value: true
137
- }
143
+ }
138
144
  ],
139
145
  endScreenActions: [
140
146
  {
@@ -159,12 +165,14 @@ createMediaPage
159
165
  #### General configuration Attributes
160
166
 
161
167
  ##### mediaRecreateHash
168
+
162
169
  \
163
- By setting the value of ```mediaRecreateHash``` to a media hash, all parameter values that was used to create this media will be directly applied in the media create form.
170
+ By setting the value of `mediaRecreateHash` to a media hash, all parameter values that was used to create this media will be directly applied in the media create form.
164
171
 
165
172
  ##### notifications
173
+
166
174
  \
167
- Optional parameter. An array of objects containing two string keys: ```type``` and ```route```. ```type``` should be set to ```'webhook'```, while ```route``` is the webhook url. When set, each time a media/creative has it's rendering status updated, the media body will be send to the webhook. Example:
175
+ Optional parameter. An array of objects containing two string keys: `type` and `route`. `type` should be set to `'webhook'`, while `route` is the webhook url. When set, each time a media/creative has it's rendering status updated, the media body will be send to the webhook. Example:
168
176
 
169
177
  ```js
170
178
  notifications: [
@@ -176,8 +184,9 @@ Optional parameter. An array of objects containing two string keys: ```type``` a
176
184
  ```
177
185
 
178
186
  ##### publish
187
+
179
188
  \
180
- Optional parameter. An array of objects containing two string keys: ```type``` and ```variant```. ```type``` should be set to an connection driver type set up on your Storyteq workspace ie. ```'google_drive'```, while ```variant``` is the desired render output, possible options are ```video, image, banner```. Note that the variant must be supported by the publish driver, otherwise upload will fail. Example:
189
+ Optional parameter. An array of objects containing two string keys: `type` and `variant`. `type` should be set to an connection driver type set up on your Storyteq workspace ie. `'google_drive'`, while `variant` is the desired render output, possible options are `video, image, banner`. Note that the variant must be supported by the publish driver, otherwise upload will fail. Example:
181
190
 
182
191
  ```js
183
192
  publish: [
@@ -189,54 +198,85 @@ Optional parameter. An array of objects containing two string keys: ```type``` a
189
198
  ```
190
199
 
191
200
  ##### creationType
201
+
192
202
  \
193
- Optional parameter. Leaving it empty will result in spwaning the single media creation form. But by setting ```creationType``` to the string value ```batch```, you will instead spawn the batch creation form. This form allows you to create several media in one go.
203
+ Optional parameter. Leaving it empty will result in spwaning the single media creation form. But by setting `creationType` to the string value `batch`, you will instead spawn the batch creation form. This form allows you to create several media in one go.
194
204
 
195
205
  #### UI Configuration Attributes
196
206
 
197
207
  ##### forceMediaPreviewBeforeCreate
208
+
198
209
  \
199
- For after effects template, ```forceMediaPreviewBeforeCreate``` allows you to enforce the creation of a 'rich preview' before action creation/publishing can be made.
210
+ For after effects template, `forceMediaPreviewBeforeCreate` allows you to enforce the creation of a 'rich preview' before action creation/publishing can be made.
200
211
 
201
212
  | Option (string) | Description |
202
- |-----------------|-------------------------------------------------------------------------------------------|
213
+ | --------------- | ----------------------------------------------------------------------------------------- |
203
214
  | always | Always enforce rich preview before creation, even after changes are applied |
204
215
  | on_first_render | Only enforce rich preview once. Changing parameter values will not enforce a new preview. |
205
216
 
217
+ ##### Theme Configuration
218
+
219
+ \
220
+ The `theme` configuration object allows you to define the primary visual aesthetic of the user interface, enabling you to customize its appearance to align with your brand or product preferences.
221
+
222
+ Possible configuration:
223
+ | Attribute | Description | Option(s) |
224
+ |--------------|-------------------------------------------------------------------------------------------|------------------|
225
+ | primaryColor | Specifies the primary color used in UI elements such as headers, buttons, and highlights. | Hex code (string)|
226
+
227
+ Example:
228
+
229
+ ```typescript
230
+ theme: {
231
+ primaryColor: '#000000', // Set the primary theme color to black
232
+ }
233
+ ```
234
+
206
235
  ##### customizationItems
236
+
207
237
  \
208
- ```customizationItems``` is an array of configuration objects which allow you to customize the general UI.
238
+ `customizationItems` is an array of configuration objects which allow you to customize the general UI.
209
239
  \
210
240
  Possible configurations:
211
241
 
212
- | Attribute | Description | Option(s) |
213
- |-----------------------------|------------------------------------------------------------------------------------------------|--------------------------------|
214
- | host_product_name | Name of your company/product | Free text (string) |
215
- | media_alias | Alias of media/creative | Free text (string) |
216
- | media_alias_plural | Alias of media/creative in plural form | Free text (string) |
217
- | batch_alias | Alias of batch | Free text (string) |
218
- | button_media_create | Media create button custom description/text | Free text (string) |
219
- | end_screen_title | Title of the screen indicating a media or media batch has been created/published | Free text (string) |
220
- | end_screen_subtitle | Subtitle of the screen indicating a media or media batch has been created/published | Free text (string) |
221
- | color_theme_hex | Color theme of UI elements such as buttons, loading bars, etc. | Hex code (string) |
222
- | full_screen | Choice of having the create form cover the whole screen or not | true/false |
223
- | cancelable | Shows a cancel button on the create media form that will event a 'canceled' event when pressed | true/false (defaults to false) |
224
- | show_end_screen_for_batches | Showing end screen dialog after creating a batch | true/false (defaults to false) |
225
- | enable_create_more | Enables the "Create & Add More" button | true/false (defaults to false) |
226
- | show_recreate_options_dialog| Show recreate/replace dialog | true/false (defaults to false) |
242
+ | Attribute | Description | Option(s) |
243
+ | ---------------------------- | ---------------------------------------------------------------------------------------------- | ------------------------------ |
244
+ | host_product_name | Name of your company/product | Free text (string) |
245
+ | media_alias | Alias of media/creative | Free text (string) |
246
+ | media_alias_plural | Alias of media/creative in plural form | Free text (string) |
247
+ | batch_alias | Alias of batch | Free text (string) |
248
+ | button_media_create | Media create button custom description/text | Free text (string) |
249
+ | end_screen_title | Title of the screen indicating a media or media batch has been created/published | Free text (string) |
250
+ | end_screen_subtitle | Subtitle of the screen indicating a media or media batch has been created/published | Free text (string) |
251
+ | color_theme_hex | Color theme of UI elements such as buttons, loading bars, etc. | Hex code (string) |
252
+ | full_screen | Choice of having the create form cover the whole screen or not | true/false |
253
+ | cancelable | Shows a cancel button on the create media form that will event a 'canceled' event when pressed | true/false (defaults to false) |
254
+ | show_end_screen_for_batches | Showing end screen dialog after creating a batch | true/false (defaults to false) |
255
+ | enable_create_more | Enables the "Create & Add More" button | true/false (defaults to false) |
256
+ | show_recreate_options_dialog | Show recreate/replace dialog | true/false (defaults to false) |
227
257
 
228
258
  #### Create & Add More
259
+
229
260
  Create & Add More functionality allows for creating additional assets after an asset has been created without having to re-open the asset create iframe.
230
261
  This should not exit the iframe after an asset is created, but have the iframe remain open. This behaviour should differentiate between the regular create asset button, based on the willCreateMore property. willCreateMore is set to true or false in the created message. This separate behavior needs to be built before using the create more action can be fully supported by the integration.
231
262
 
232
263
  ##### endScreenActions
264
+
233
265
  \
234
- ```endScreenActions``` is an array of configuration objects that allows you to customize the UI of the 'end screen', by adding certain actions.
266
+ `endScreenActions` is an array of configuration objects that allows you to customize the UI of the 'end screen', by adding certain actions.
235
267
  The end screen is what appears after you have initiated the creation/publishing of a media or media batch.
236
268
  \
237
269
  Possible configurations:
238
270
 
239
271
  | Attribute/Action | Description | Option(s) |
240
- |----------------------|----------------------------------------------------------------------------|-----------------------------------|
272
+ | -------------------- | -------------------------------------------------------------------------- | --------------------------------- |
241
273
  | create_another_media | By including this, a button will appear that allow you to recreate a media | Free text (string, inside button) |
242
274
  | create_another_batch | By including this, a button will appear that allow you to recreate a batch | Free text (string, inside button) |
275
+
276
+ # How to release new version?
277
+
278
+ ```bash
279
+ pnpm install
280
+ pnpm release --release-as 1.0.5 # replace with the new version
281
+ git push --follow-tags origin BRANCH_NAME && npm publish;
282
+ ```
@@ -1,5 +1,5 @@
1
1
  import { BaseFrameController } from './BaseFrameController';
2
- export declare const AVAILABLE_CREATE_MEDIA_EVENTS: ['loaded', 'created', 'batch-created', 'canceled'];
2
+ export declare const AVAILABLE_CREATE_MEDIA_EVENTS: ['loaded', 'created', 'batch-created', 'batch-loaded', 'canceled'];
3
3
  export interface ICreateMediaConfig {
4
4
  creationType?: 'batch' | 'batch-edit' | 'batch-copy';
5
5
  batchId?: number;
@@ -23,6 +23,9 @@ export interface ICreateMediaConfig {
23
23
  value: string;
24
24
  }>;
25
25
  forceMediaPreviewBeforeCreate?: 'on_first_render' | 'always';
26
+ theme?: {
27
+ primaryColor?: string;
28
+ };
26
29
  };
27
30
  batchUi?: {
28
31
  enableNameEdit?: boolean;
package/build/index.js CHANGED
@@ -1,2 +1,2 @@
1
- !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("lodash-es")):"function"==typeof define&&define.amd?define(["lodash-es"],t):"object"==typeof exports?exports["@storyteq/platform-integration"]=t(require("lodash-es")):e["@storyteq/platform-integration"]=t(e._)}(this,(function(e){return function(){"use strict";var t={769:function(t){t.exports=e}},n={};function r(e){var s=n[e];if(void 0!==s)return s.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,r),i.exports}r.d=function(e,t){for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return function(){r.r(s),r.d(s,{AVAILABLE_CREATE_MEDIA_EVENTS:function(){return n},CreateMediaPage:function(){return i},CrmAnalyticsPage:function(){return o}});var e=r(769);class t{constructor(t,n,r,s,i,o={}){this.spawnElement=t,this.authToken=n,this.availableEvents=i,this._eventListeners=[],this._readyForToken=!1,this._readyForTokenCb=()=>{this._readyForToken=!0,this._jwtToken&&(this.setJwtToken(this._jwtToken),this._jwtToken="")},this._receiveMessage=t=>{if(t.origin===this._url.origin)try{const n=JSON.parse(t.data);this._eventListeners.forEach((({event:t,cb:r})=>{const s=(0,e.omit)(n,["event"]);t===n.event&&r(s)}))}catch(e){console.error("[Storyteq platform integration] Failed to parse incoming frame message;",t.data)}},this._url=new URL(r,window.APP_URL??"https://platform.storyteq.com");const a={no_navigation:"true",config:s,...o};n?a.auth_token=n:(a.auth_via_message="",this._eventListeners.push({event:"ready_for_token",cb:this._readyForTokenCb})),(0,e.forEach)(a,((e,t)=>{this._url.searchParams.set(t,e)})),this._init()}_init(){["interactive","complete"].includes(document.readyState)?this._spawn():document.addEventListener("readystatechange",(()=>{["interactive","complete"].includes(document.readyState)&&this._spawn()}))}_spawn(){const e=document.createElement("iframe");e.src=this._url.toString(),e.style.width="100%",e.style.height="100%",e.style.position="absolute",e.style.border="none";const t=document.querySelector(this.spawnElement);t||console.error(`[Storyteq platform integration] Failed to find target element ${this.spawnElement}`),t.style.position="relative",t.appendChild(e),this._frame=e,this._initiatePageListeners()}_initiatePageListeners(){window.addEventListener("message",this._receiveMessage,!1)}on(e,t){return this.availableEvents.includes(e)||console.error(`[Storyteq platform integration] Trying to listen to unsupported event "${e}"`),this._eventListeners.push({event:e,cb:t}),this}sendMessage(e){return this._frame.contentWindow.postMessage(e,{targetOrigin:this._url.origin}),this}setJwtToken(e){return this._readyForToken?this.sendMessage({type:"JWT_TOKEN",token:e}):this._jwtToken=e,this}destroy(){if(this._frame){window.removeEventListener("message",this._receiveMessage),this._eventListeners=[];try{this._frame.parentElement.removeChild(this._frame)}catch(e){}}}}const n=["loaded","created","batch-created","canceled"];class i extends t{constructor(e,t,r,s,i={}){super(e,t,"/integration",JSON.stringify(i),n,{companyId:`${s}`,templateId:`${r}`})}}class o extends t{constructor(e,t,n,r,s){super(e,t,`/campaigns/${r}/templates/${n}`,JSON.stringify(s),["loaded"])}}}(),s}()}));
1
+ !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("lodash-es")):"function"==typeof define&&define.amd?define(["lodash-es"],t):"object"==typeof exports?exports["@storyteq/platform-integration"]=t(require("lodash-es")):e["@storyteq/platform-integration"]=t(e._)}(this,(function(e){return function(){"use strict";var t={731:function(t){t.exports=e}},n={};function r(e){var s=n[e];if(void 0!==s)return s.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,r),i.exports}r.d=function(e,t){for(var n in t)r.o(t,n)&&!r.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return function(){r.r(s),r.d(s,{AVAILABLE_CREATE_MEDIA_EVENTS:function(){return n},CreateMediaPage:function(){return i},CrmAnalyticsPage:function(){return o}});var e=r(731);class t{constructor(t,n,r,s,i,o={}){this.spawnElement=t,this.authToken=n,this.availableEvents=i,this._eventListeners=[],this._readyForToken=!1,this._readyForTokenCb=()=>{this._readyForToken=!0,this._jwtToken&&(this.setJwtToken(this._jwtToken),this._jwtToken="")},this._receiveMessage=t=>{if(t.origin===this._url.origin)try{const n=JSON.parse(t.data);this._eventListeners.forEach((({event:t,cb:r})=>{const s=(0,e.omit)(n,["event"]);t===n.event&&r(s)}))}catch(e){console.error("[Storyteq platform integration] Failed to parse incoming frame message;",t.data)}},this._url=new URL(r,window.APP_URL??"https://platform.storyteq.com");const a={no_navigation:"true",config:s,...o};n?a.auth_token=n:(a.auth_via_message="",this._eventListeners.push({event:"ready_for_token",cb:this._readyForTokenCb})),(0,e.forEach)(a,((e,t)=>{this._url.searchParams.set(t,e)})),this._init()}_init(){["interactive","complete"].includes(document.readyState)?this._spawn():document.addEventListener("readystatechange",(()=>{["interactive","complete"].includes(document.readyState)&&this._spawn()}))}_spawn(){const e=document.createElement("iframe");e.src=this._url.toString(),e.style.width="100%",e.style.height="100%",e.style.position="absolute",e.style.border="none";const t=document.querySelector(this.spawnElement);t||console.error(`[Storyteq platform integration] Failed to find target element ${this.spawnElement}`),t.style.position="relative",t.appendChild(e),this._frame=e,this._initiatePageListeners()}_initiatePageListeners(){window.addEventListener("message",this._receiveMessage,!1)}on(e,t){return this.availableEvents.includes(e)||console.error(`[Storyteq platform integration] Trying to listen to unsupported event "${e}"`),this._eventListeners.push({event:e,cb:t}),this}sendMessage(e){return this._frame.contentWindow.postMessage(e,{targetOrigin:this._url.origin}),this}setJwtToken(e){return this._readyForToken?this.sendMessage({type:"JWT_TOKEN",token:e}):this._jwtToken=e,this}destroy(){if(this._frame){window.removeEventListener("message",this._receiveMessage),this._eventListeners=[];try{this._frame.parentElement.removeChild(this._frame)}catch(e){}}}}const n=["loaded","created","batch-created","batch-loaded","canceled"];class i extends t{constructor(e,t,r,s,i={}){super(e,t,"/integration",JSON.stringify(i),n,{companyId:`${s}`,templateId:`${r}`})}}class o extends t{constructor(e,t,n,r,s){super(e,t,`/campaigns/${r}/templates/${n}`,JSON.stringify(s),["loaded"])}}}(),s}()}));
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,EAAQG,QAAQ,cACR,mBAAXC,QAAyBA,OAAOC,IAC9CD,OAAO,CAAC,aAAcJ,GACI,iBAAZC,QACdA,QAAQ,kCAAoCD,EAAQG,QAAQ,cAE5DJ,EAAK,kCAAoCC,EAAQD,EAAQ,EAC1D,CATD,CASGO,MAAM,SAASC,GAClB,O,+CCVAL,EAAOD,QAAUM,C,GCCbC,EAA2B,CAAC,EAGhC,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqBE,IAAjBD,EACH,OAAOA,EAAaV,QAGrB,IAAIC,EAASM,EAAyBE,GAAY,CAGjDT,QAAS,CAAC,GAOX,OAHAY,EAAoBH,GAAUR,EAAQA,EAAOD,QAASQ,GAG/CP,EAAOD,OACf,CCrBAQ,EAAoBK,EAAI,SAASb,EAASc,GACzC,IAAI,IAAIC,KAAOD,EACXN,EAAoBQ,EAAEF,EAAYC,KAASP,EAAoBQ,EAAEhB,EAASe,IAC5EE,OAAOC,eAAelB,EAASe,EAAK,CAAEI,YAAY,EAAMC,IAAKN,EAAWC,IAG3E,ECPAP,EAAoBQ,EAAI,SAASK,EAAKC,GAAQ,OAAOL,OAAOM,UAAUC,eAAeC,KAAKJ,EAAKC,EAAO,ECCtGd,EAAoBkB,EAAI,SAAS1B,GACX,oBAAX2B,QAA0BA,OAAOC,aAC1CX,OAAOC,eAAelB,EAAS2B,OAAOC,YAAa,CAAEC,MAAO,WAE7DZ,OAAOC,eAAelB,EAAS,aAAc,CAAE6B,OAAO,GACvD,E,sLCFO,MAAMC,EAgBX,WAAAC,CACkBC,EACAC,EAChBC,EACAC,EACgBC,EAChBC,EAA4C,CAAC,GAL7B,KAAAL,aAAAA,EACA,KAAAC,UAAAA,EAGA,KAAAG,gBAAAA,EAnBV,KAAAE,gBAAyE,GACzE,KAAAC,gBAAiB,EAIjB,KAAAC,iBAAmB,KACzBnC,KAAKkC,gBAAiB,EAElBlC,KAAKoC,YACPpC,KAAKqC,YAAYrC,KAAKoC,WACtBpC,KAAKoC,UAAY,GACnB,EAiEM,KAAAE,gBAAmBC,IACzB,GAAIA,EAAEC,SAAWxC,KAAKyC,KAAKD,OACzB,IACE,MAAME,EAAiBC,KAAKC,MAAML,EAAEM,MAEpC7C,KAAKiC,gBAAgBa,SAAQ,EAAGC,QAAOC,SACrC,MAAMC,GAAe,IAAAC,MAAKR,EAAgB,CAAC,UAEvCK,IAAUL,EAAeK,OAAOC,EAAGC,EAAa,GAExD,CAAE,MAAOE,GACPC,QAAQD,MAAM,0EAA2EZ,EAAEM,KAC7F,CACF,EAnEA7C,KAAKyC,KAAO,IAAIY,IAAIxB,EC3BfyB,OAAOC,SAAW,iCD6BvB,MAAMC,EAAuC,CAC3CC,cAAe,OACf3B,OAAQA,KACLE,GAGDJ,EACF4B,EAAaE,WAAa9B,GAE1B4B,EAAaG,iBAAmB,GAEhC3D,KAAKiC,gBAAgB2B,KAAK,CAAEb,MAAO,kBAAmBC,GAAIhD,KAAKmC,qBAGjE,IAAAW,SAAQU,GAAc,CAAChC,EAAed,KACpCV,KAAKyC,KAAKe,aAAaK,IAAInD,EAAKc,EAAM,IAGxCxB,KAAK8D,OACP,CAEQ,KAAAA,GACD,CAAC,cAAe,YAAYC,SAASC,SAASC,YAI5CjE,KAAKkE,SAHVF,SAASG,iBAAiB,oBAAoB,KACxC,CAAC,cAAe,YAAYJ,SAASC,SAASC,aAAajE,KAAKkE,QAAQ,GAGlF,CAEQ,MAAAA,GACN,MAAME,EAA4BJ,SAASK,cAAc,UAEzDD,EAAOE,IAAMtE,KAAKyC,KAAK8B,WACvBH,EAAOI,MAAMC,MAAQ,OACrBL,EAAOI,MAAME,OAAS,OACtBN,EAAOI,MAAMG,SAAW,WACxBP,EAAOI,MAAMI,OAAS,OAEtB,MAAMjD,EAA4BqC,SAASa,cAAc7E,KAAK2B,cAEzDA,GACHyB,QAAQD,MAAM,iEAAiEnD,KAAK2B,gBAGtFA,EAAa6C,MAAMG,SAAW,WAC9BhD,EAAamD,YAAYV,GAEzBpE,KAAK+E,OAASX,EAEdpE,KAAKgF,wBACP,CAkBQ,sBAAAA,GACN1B,OAAOa,iBAAiB,UAAWnE,KAAKsC,iBAAiB,EAC3D,CAEO,EAAA2C,CAAGlC,EAAiBC,GAUzB,OATKhD,KAAK+B,gBAAgBgC,SAAShB,IACjCK,QAAQD,MAAM,0EAA0EJ,MAG1F/C,KAAKiC,gBAAgB2B,KAAK,CACxBb,QACAC,OAGKhD,IACT,CAEO,WAAAkF,CAAYC,GAGjB,OAFAnF,KAAK+E,OAAOK,cAAcC,YAAYF,EAAS,CAAEG,aAActF,KAAKyC,KAAKD,SAElExC,IACT,CAEO,WAAAqC,CAAYkD,GAOjB,OANKvF,KAAKkC,eAGRlC,KAAKkF,YAAY,CAAEM,KAAM,YAAaD,UAFtCvF,KAAKoC,UAAYmD,EAKZvF,IACT,CAEO,OAAAyF,GACL,GAAKzF,KAAK+E,OAAV,CAIAzB,OAAOoC,oBAAoB,UAAW1F,KAAKsC,iBAE3CtC,KAAKiC,gBAAkB,GAEvB,IACEjC,KAAK+E,OAAOY,cAAcC,YAAY5F,KAAK+E,OAC7C,CAAE,MAAO5B,GAAQ,CARjB,CASF,EE7IK,MAAM0C,EAAoF,CAC/F,SACA,UACA,gBACA,YAmBK,MAAMC,UAAwBrE,EACnC,WAAAC,CACEC,EACAoE,EACAC,EACAC,EACAnE,EAA6B,CAAC,GAI9BoE,MAAMvE,EAAcoE,EAFP,eAE0BpD,KAAKwD,UAAUrE,GAAS+D,EAA+B,CAC5FI,UAAW,GAAGA,IACdD,WAAY,GAAGA,KAEnB,ECrCK,MAAMI,UAAyB3E,EACpC,WAAAC,CAAYC,EAAsBoE,EAA6BC,EAAoBK,EAAoBvE,GAGrGoE,MAAMvE,EAAcoE,EAFP,cAAcM,eAAwBL,IAEZrD,KAAKwD,UAAUrE,GAAS,CAAC,UAClE,E","sources":["webpack://@storyteq/platform-integration/webpack/universalModuleDefinition","webpack://@storyteq/platform-integration/external umd {\"commonjs\":\"lodash-es\",\"commonjs2\":\"lodash-es\",\"amd\":\"lodash-es\",\"root\":\"_\"}","webpack://@storyteq/platform-integration/webpack/bootstrap","webpack://@storyteq/platform-integration/webpack/runtime/define property getters","webpack://@storyteq/platform-integration/webpack/runtime/hasOwnProperty shorthand","webpack://@storyteq/platform-integration/webpack/runtime/make namespace object","webpack://@storyteq/platform-integration/./src/classes/BaseFrameController.ts","webpack://@storyteq/platform-integration/./src/get-frame-url.ts","webpack://@storyteq/platform-integration/./src/classes/CreateMediaPage.ts","webpack://@storyteq/platform-integration/./src/classes/CrmAnalyticsPage.ts"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"lodash-es\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"lodash-es\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"@storyteq/platform-integration\"] = factory(require(\"lodash-es\"));\n\telse\n\t\troot[\"@storyteq/platform-integration\"] = factory(root[\"_\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE__769__) {\nreturn ","module.exports = __WEBPACK_EXTERNAL_MODULE__769__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import { forEach, omit } from 'lodash-es';\nimport { getFrameUrl } from '../get-frame-url';\nimport { OneOf } from '../interfaces/one-of.interface';\n\nexport class BaseFrameController<T extends Array<string>> {\n private _url: URL;\n private _eventListeners: Array<{ event: string; cb: (data: unknown) => void }> = [];\n private _readyForToken = false;\n private _jwtToken: string;\n private _frame: HTMLIFrameElement;\n\n private _readyForTokenCb = () => {\n this._readyForToken = true;\n\n if (this._jwtToken) {\n this.setJwtToken(this._jwtToken);\n this._jwtToken = '';\n }\n };\n\n constructor(\n public readonly spawnElement: string,\n public readonly authToken: string | false,\n uri: string,\n config: string,\n public readonly availableEvents: T,\n extraSearchParams: Record<string, string> = {}\n ) {\n this._url = new URL(uri, getFrameUrl());\n\n const searchParams: Record<string, string> = {\n no_navigation: 'true',\n config: config,\n ...extraSearchParams,\n };\n\n if (authToken) {\n searchParams.auth_token = authToken;\n } else {\n searchParams.auth_via_message = '';\n\n this._eventListeners.push({ event: 'ready_for_token', cb: this._readyForTokenCb });\n }\n\n forEach(searchParams, (value: string, key: string) => {\n this._url.searchParams.set(key, value);\n });\n\n this._init();\n }\n\n private _init(): void {\n if (!['interactive', 'complete'].includes(document.readyState)) {\n document.addEventListener('readystatechange', () => {\n if (['interactive', 'complete'].includes(document.readyState)) this._spawn();\n });\n } else this._spawn();\n }\n\n private _spawn(): void {\n const iframe: HTMLIFrameElement = document.createElement('iframe');\n\n iframe.src = this._url.toString();\n iframe.style.width = '100%';\n iframe.style.height = '100%';\n iframe.style.position = 'absolute';\n iframe.style.border = 'none';\n\n const spawnElement: HTMLElement = document.querySelector(this.spawnElement);\n\n if (!spawnElement) {\n console.error(`[Storyteq platform integration] Failed to find target element ${this.spawnElement}`);\n }\n\n spawnElement.style.position = 'relative';\n spawnElement.appendChild(iframe);\n\n this._frame = iframe;\n\n this._initiatePageListeners();\n }\n\n private _receiveMessage = (e: MessageEvent) => {\n if (e.origin === this._url.origin) {\n try {\n const messagePayload = JSON.parse(e.data);\n\n this._eventListeners.forEach(({ event, cb }) => {\n const eventPayload = omit(messagePayload, ['event']);\n\n if (event === messagePayload.event) cb(eventPayload);\n });\n } catch (error) {\n console.error('[Storyteq platform integration] Failed to parse incoming frame message;', e.data);\n }\n }\n };\n\n private _initiatePageListeners(): void {\n window.addEventListener('message', this._receiveMessage, false);\n }\n\n public on(event: OneOf<T>, cb: (data: unknown) => void): this {\n if (!this.availableEvents.includes(event)) {\n console.error(`[Storyteq platform integration] Trying to listen to unsupported event \"${event}\"`);\n }\n\n this._eventListeners.push({\n event,\n cb,\n });\n\n return this;\n }\n\n public sendMessage(message: any): this {\n this._frame.contentWindow.postMessage(message, { targetOrigin: this._url.origin });\n\n return this;\n }\n\n public setJwtToken(token: string): this {\n if (!this._readyForToken) {\n this._jwtToken = token;\n } else {\n this.sendMessage({ type: 'JWT_TOKEN', token });\n }\n\n return this;\n }\n\n public destroy(): void {\n if (!this._frame) {\n return;\n }\n\n window.removeEventListener('message', this._receiveMessage);\n\n this._eventListeners = [];\n\n try {\n this._frame.parentElement.removeChild(this._frame);\n } catch (error) {}\n }\n}\n","export function getFrameUrl() {\n return window.APP_URL ?? 'https://platform.storyteq.com';\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport const AVAILABLE_CREATE_MEDIA_EVENTS: ['loaded', 'created', 'batch-created', 'canceled'] = [\n 'loaded',\n 'created',\n 'batch-created',\n 'canceled',\n];\n\nexport interface ICreateMediaConfig {\n creationType?: 'batch' | 'batch-edit' | 'batch-copy';\n batchId?: number;\n publish?: Array<{ type: string; variant?: string; parameters?: Array<string> }>; // Upon rendering completion, publish to this channel\n notifications?: Array<{ type?: string; route?: string }>; // Will send a notification to the target route upon media status change with the full media object\n mediaRecreateHash?: string;\n ui?: {\n customizationItems?: Array<{ item: string; value: string | boolean }>;\n endScreenActions?: Array<{ action: string; value: string }>;\n forceMediaPreviewBeforeCreate?: 'on_first_render' | 'always';\n }; // Customize the UI\n batchUi?: {\n enableNameEdit?: boolean;\n }; // Customize the batch UI\n}\n\nexport class CreateMediaPage extends BaseFrameController<typeof AVAILABLE_CREATE_MEDIA_EVENTS> {\n constructor(\n spawnElement: string,\n STAuthToken: string | false,\n templateId: number,\n companyId: number,\n config: ICreateMediaConfig = {}\n ) {\n const page = `/integration`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), AVAILABLE_CREATE_MEDIA_EVENTS, {\n companyId: `${companyId}`,\n templateId: `${templateId}`,\n });\n }\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport class CrmAnalyticsPage extends BaseFrameController<['loaded']> {\n constructor(spawnElement: string, STAuthToken: string | false, templateId: number, campaignId: number, config?) {\n const page = `/campaigns/${campaignId}/templates/${templateId}`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), ['loaded']);\n }\n}\n"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE__769__","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","d","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value","BaseFrameController","constructor","spawnElement","authToken","uri","config","availableEvents","extraSearchParams","_eventListeners","_readyForToken","_readyForTokenCb","_jwtToken","setJwtToken","_receiveMessage","e","origin","_url","messagePayload","JSON","parse","data","forEach","event","cb","eventPayload","omit","error","console","URL","window","APP_URL","searchParams","no_navigation","auth_token","auth_via_message","push","set","_init","includes","document","readyState","_spawn","addEventListener","iframe","createElement","src","toString","style","width","height","position","border","querySelector","appendChild","_frame","_initiatePageListeners","on","sendMessage","message","contentWindow","postMessage","targetOrigin","token","type","destroy","removeEventListener","parentElement","removeChild","AVAILABLE_CREATE_MEDIA_EVENTS","CreateMediaPage","STAuthToken","templateId","companyId","super","stringify","CrmAnalyticsPage","campaignId"],"sourceRoot":""}
1
+ {"version":3,"file":"index.js","mappings":"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","sources":["webpack://@storyteq/platform-integration/webpack/universalModuleDefinition","webpack://@storyteq/platform-integration/external umd {\"commonjs\":\"lodash-es\",\"commonjs2\":\"lodash-es\",\"amd\":\"lodash-es\",\"root\":\"_\"}","webpack://@storyteq/platform-integration/webpack/bootstrap","webpack://@storyteq/platform-integration/webpack/runtime/define property getters","webpack://@storyteq/platform-integration/webpack/runtime/hasOwnProperty shorthand","webpack://@storyteq/platform-integration/webpack/runtime/make namespace object","webpack://@storyteq/platform-integration/./src/classes/BaseFrameController.ts","webpack://@storyteq/platform-integration/./src/get-frame-url.ts","webpack://@storyteq/platform-integration/./src/classes/CreateMediaPage.ts","webpack://@storyteq/platform-integration/./src/classes/CrmAnalyticsPage.ts"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"lodash-es\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"lodash-es\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"@storyteq/platform-integration\"] = factory(require(\"lodash-es\"));\n\telse\n\t\troot[\"@storyteq/platform-integration\"] = factory(root[\"_\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE__731__) {\nreturn ","module.exports = __WEBPACK_EXTERNAL_MODULE__731__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import { forEach, omit } from 'lodash-es';\nimport { getFrameUrl } from '../get-frame-url';\nimport { OneOf } from '../interfaces/one-of.interface';\n\nexport class BaseFrameController<T extends Array<string>> {\n private _url: URL;\n private _eventListeners: Array<{ event: string; cb: (data: unknown) => void }> = [];\n private _readyForToken = false;\n private _jwtToken: string;\n private _frame: HTMLIFrameElement;\n\n private _readyForTokenCb = () => {\n this._readyForToken = true;\n\n if (this._jwtToken) {\n this.setJwtToken(this._jwtToken);\n this._jwtToken = '';\n }\n };\n\n constructor(\n public readonly spawnElement: string,\n public readonly authToken: string | false,\n uri: string,\n config: string,\n public readonly availableEvents: T,\n extraSearchParams: Record<string, string> = {}\n ) {\n this._url = new URL(uri, getFrameUrl());\n\n const searchParams: Record<string, string> = {\n no_navigation: 'true',\n config: config,\n ...extraSearchParams,\n };\n\n if (authToken) {\n searchParams.auth_token = authToken;\n } else {\n searchParams.auth_via_message = '';\n\n this._eventListeners.push({ event: 'ready_for_token', cb: this._readyForTokenCb });\n }\n\n forEach(searchParams, (value: string, key: string) => {\n this._url.searchParams.set(key, value);\n });\n\n this._init();\n }\n\n private _init(): void {\n if (!['interactive', 'complete'].includes(document.readyState)) {\n document.addEventListener('readystatechange', () => {\n if (['interactive', 'complete'].includes(document.readyState)) this._spawn();\n });\n } else this._spawn();\n }\n\n private _spawn(): void {\n const iframe: HTMLIFrameElement = document.createElement('iframe');\n\n iframe.src = this._url.toString();\n iframe.style.width = '100%';\n iframe.style.height = '100%';\n iframe.style.position = 'absolute';\n iframe.style.border = 'none';\n\n const spawnElement: HTMLElement = document.querySelector(this.spawnElement);\n\n if (!spawnElement) {\n console.error(`[Storyteq platform integration] Failed to find target element ${this.spawnElement}`);\n }\n\n spawnElement.style.position = 'relative';\n spawnElement.appendChild(iframe);\n\n this._frame = iframe;\n\n this._initiatePageListeners();\n }\n\n private _receiveMessage = (e: MessageEvent) => {\n if (e.origin === this._url.origin) {\n try {\n const messagePayload = JSON.parse(e.data);\n\n this._eventListeners.forEach(({ event, cb }) => {\n const eventPayload = omit(messagePayload, ['event']);\n\n if (event === messagePayload.event) cb(eventPayload);\n });\n } catch (error) {\n console.error('[Storyteq platform integration] Failed to parse incoming frame message;', e.data);\n }\n }\n };\n\n private _initiatePageListeners(): void {\n window.addEventListener('message', this._receiveMessage, false);\n }\n\n public on(event: OneOf<T>, cb: (data: unknown) => void): this {\n if (!this.availableEvents.includes(event)) {\n console.error(`[Storyteq platform integration] Trying to listen to unsupported event \"${event}\"`);\n }\n\n this._eventListeners.push({\n event,\n cb,\n });\n\n return this;\n }\n\n public sendMessage(message: any): this {\n this._frame.contentWindow.postMessage(message, { targetOrigin: this._url.origin });\n\n return this;\n }\n\n public setJwtToken(token: string): this {\n if (!this._readyForToken) {\n this._jwtToken = token;\n } else {\n this.sendMessage({ type: 'JWT_TOKEN', token });\n }\n\n return this;\n }\n\n public destroy(): void {\n if (!this._frame) {\n return;\n }\n\n window.removeEventListener('message', this._receiveMessage);\n\n this._eventListeners = [];\n\n try {\n this._frame.parentElement.removeChild(this._frame);\n } catch (error) {}\n }\n}\n","export function getFrameUrl() {\n return window.APP_URL ?? 'https://platform.storyteq.com';\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport const AVAILABLE_CREATE_MEDIA_EVENTS: ['loaded', 'created', 'batch-created', 'batch-loaded', 'canceled'] = [\n 'loaded',\n 'created',\n 'batch-created',\n 'batch-loaded',\n 'canceled',\n];\n\nexport interface ICreateMediaConfig {\n creationType?: 'batch' | 'batch-edit' | 'batch-copy';\n batchId?: number;\n publish?: Array<{ type: string; variant?: string; parameters?: Array<string> }>; // Upon rendering completion, publish to this channel\n notifications?: Array<{ type?: string; route?: string }>; // Will send a notification to the target route upon media status change with the full media object\n mediaRecreateHash?: string;\n ui?: {\n customizationItems?: Array<{ item: string; value: string | boolean }>;\n endScreenActions?: Array<{ action: string; value: string }>;\n forceMediaPreviewBeforeCreate?: 'on_first_render' | 'always';\n theme?: {\n primaryColor?: string;\n };\n }; // Customize the UI\n batchUi?: {\n enableNameEdit?: boolean;\n }; // Customize the batch UI\n}\n\nexport class CreateMediaPage extends BaseFrameController<typeof AVAILABLE_CREATE_MEDIA_EVENTS> {\n constructor(\n spawnElement: string,\n STAuthToken: string | false,\n templateId: number,\n companyId: number,\n config: ICreateMediaConfig = {}\n ) {\n const page = `/integration`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), AVAILABLE_CREATE_MEDIA_EVENTS, {\n companyId: `${companyId}`,\n templateId: `${templateId}`,\n });\n }\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport class CrmAnalyticsPage extends BaseFrameController<['loaded']> {\n constructor(spawnElement: string, STAuthToken: string | false, templateId: number, campaignId: number, config?) {\n const page = `/campaigns/${campaignId}/templates/${templateId}`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), ['loaded']);\n }\n}\n"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE__731__","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","d","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value","BaseFrameController","constructor","spawnElement","authToken","uri","config","availableEvents","extraSearchParams","_eventListeners","_readyForToken","_readyForTokenCb","_jwtToken","setJwtToken","_receiveMessage","e","origin","_url","messagePayload","JSON","parse","data","forEach","event","cb","eventPayload","omit","error","console","URL","window","APP_URL","searchParams","no_navigation","auth_token","auth_via_message","push","set","_init","includes","document","readyState","_spawn","addEventListener","iframe","createElement","src","toString","style","width","height","position","border","querySelector","appendChild","_frame","_initiatePageListeners","on","sendMessage","message","contentWindow","postMessage","targetOrigin","token","type","destroy","removeEventListener","parentElement","removeChild","AVAILABLE_CREATE_MEDIA_EVENTS","CreateMediaPage","STAuthToken","templateId","companyId","super","stringify","CrmAnalyticsPage","campaignId"],"sourceRoot":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storyteq/platform-integration",
3
- "version": "1.0.5",
3
+ "version": "1.0.8",
4
4
  "description": "Integrate with views from the Storyteq platform",
5
5
  "main": "./build/index.js",
6
6
  "types": "./build/index.d.ts",