Merge pull request #250 from as-ideas/OIL-309/fixIntegratedCpc

Oil 309/fix integrated cpc

README.md

@@ -148,29 +148,32 @@ For detailed explanations, please visit the [documentation](https://oil.axelspri
 
 | Config Parameter | Description | Default Setting |
 |----------|---------------|-------|
-| publicPath | The server path from which all chunks and ressources will be loaded. You should upload all released files there and configure it. | `//unpkg.com/@ideasio/oil.js@{oilVersion}/release/current/`
+| advanced_settings | Replaces the No Button with an advanced settings button, displaying the Cookie Preference Center. The CPC enables the user to choose their own level of privacy. These settings are stored in the oil cookie (both SOI and POI) as well. | False
+| advanced_settings_purposes_default | All purposes in the advanced settings layer should be activated by default | false
+| config_version | Specifies the version of your OIL configuration. It will be stored with the consent cookie to track which explicit configuration version consent was granted for.| None
+| cookie_expires_in_days | Value in days until the domain cookie used to save the users decision in days | 31
+| cpc_type | Specifies the type (the layout) of the Cookie Preference Center. Currently, two types are supported: 'standard' and 'tabs'. Depending on this parameter additional label configuration may be necessary. See section <<Full Label Configuration>> for details. | standard
+| customPurposes | Array of custom purposes defined by publisher. IDs for custom purposes may range from 25-88. | None
+| customVendorListUrl | Custom vendor list ('non IAB vendors') to use, will be loaded at the same time as the iabVendorList. | None
+| default_to_optin | Signal opt-in to vendors while still displaying the Opt-In layer to the end user | false
+| gdpr_applies_globally | Flag to indicate that publisher is from the EU, thus showing the OIL layer to every user. The flag is passed to vendors. | true
+| iabVendorBlacklist | Array of vendor IDs to exclude. | None
+| iabVendorListUrl | URL of the list of vendors to use | https://vendorlist.consensu.org/vendorlist.json
+| iabVendorWhitelist | Array of vendor IDs to allow. If it is set, values in `iabVendorBlacklist` are ignored. | None
 | locale | Object including locale version, id and labels. You can define the standard labels for all legal texts and buttons and set a version for it. See [here for a configuration example](#texts-locale-object) and [here for all localizable labels](#available-text-labels) | None
 | locale_url | As an alternative to passing a locale object, set this to a JSON file with the locale configuration. See [here for an example file](https://github.com/as-ideas/oil/blob/master/test/fixtures/config/deDE_01_locale.json) | None
-| preview_mode | The preview mode is useful when testing OIL in a production or live environment. When value is `true`, the layer remains hidden until you manually trigger `window.AS_OIL.previewModeOn()` in your console. Reload, and the layer is displayed. You can hide it again with `window.AS_OIL.previewModeOff()`. | false
-| theme | The theme for the layer. By default there are two themes, 'dark' and 'light', with 'light' beeing the default. The theme currently works only as an additional css class. If you want to change the style or theme, please look into the styling guide in the development section. | 'light'
+| persist_min_tracking | If minimum tracking should result in removing all OIL cookies from the users browser and close the layer and store this selection in the oil cookie. | True
 | poi_activate_poi | Activates single consent cookie for multiple websites. [See requirements for POI here](#poi--power-opt-in) | false
+| poi_group_name | POI group name. POI only affects those sites with the same group name (mandatory if POI is activated). The group name must be valid (existing). | None
 | poi_hub_origin | The origin of the hub.js installation | `https://unpkg.com`
 | poi_hub_path | The path to the hub.html installation on the origin, if any. | `/@ideasio/oil.js@{oilVersion}/release/current/hub.html`
-| poi_group_name | POI group name. POI only affects those sites with the same group name (mandatory if POI is activated). The group name must be valid (existing). | none
 | poi_subscriber_set_cookie | Whether to set the SOI cookie on POI opt-ins or not. | true
-| cookie_expires_in_days | Value in days until the domain cookie used to save the users decision in days | 31
-| timeout | Value in seconds until the opt-in layer will be automatically hidden. 0 or lower deactivates auto-hide. | 60
-| advanced_settings | Replaces the No Button with an advanced settings button, displaying the Cookie Preference Center. The CPC enables the user to choose their own level of privacy. These settings are stored in the oil cookie (both SOI and POI) as well. | False
-| persist_min_tracking | If minimum tracking should result in removing all OIL cookies from the users browser and close the layer and store this selection in the oil cookie. | True
-| iabVendorListUrl | URL of the list of vendors to use | https://vendorlist.consensu.org/vendorlist.json
-| iabVendorWhitelist | Array of vendor IDs to allow. If it is set, values in `iabVendorBlacklist` are ignored. | None
-| iabVendorBlacklist | Array of vendor IDs to exclude. | None
-| show_limited_vendors_only | Flag to only show the vendors limited by `iabVendorWhitelist` or `iabVendorBlacklist` in the CPC | false
-| customPurposes | Array of custom purposes defined by publisher. IDs for custom purposes may range from 25-88. | None
-| default_to_optin | Signal opt-in to vendors while still displaying the Opt-In layer to the end user | false
-| advanced_settings_purposes_default | All purposes in the advanced settings layer should be activated by default | false
-| gdpr_applies_globally | Flag to indicate that publisher is from the EU, thus showing the OIL layer to every user. The flag is passed to vendors. | true
+| preview_mode | The preview mode is useful when testing OIL in a production or live environment. When value is `true`, the layer remains hidden until you manually trigger `window.AS_OIL.previewModeOn()` in your console. Reload, and the layer is displayed. You can hide it again with `window.AS_OIL.previewModeOff()`. | false
+| publicPath | The server path from which all chunks and ressources will be loaded. You should upload all released files there and configure it. | `//unpkg.com/@ideasio/oil.js@{oilVersion}/release/current/`
 | require_optout_confirm | Flag to activate the opt-out confirmation dialog within the CPC. If set to `true`, additional label definitions (with prefix `label_cpc_purpose_optout`) are required. See the label configuration section in the documentation for details. | false
+| show_limited_vendors_only | Flag to only show the vendors limited by `iabVendorWhitelist` or `iabVendorBlacklist` in the CPC | false
+| theme | The theme for the layer. By default there are two themes, 'dark' and 'light', with 'light' beeing the default. The theme currently works only as an additional css class. If you want to change the style or theme, please look into the styling guide in the development section. | 'light'
+| timeout | Value in seconds until the opt-in layer will be automatically hidden. 0 or lower deactivates auto-hide. | 60
 
 ### Texts & Locale Object
 

docs/src/docs/03-configuration.adoc

@@ -121,18 +121,18 @@ This is a full list of configurable options.
 | config_version | Specifies the version of your OIL configuration. It will be stored with the consent cookie to track which explicit configuration version consent was granted for.| None
 | cookie_expires_in_days | Value in days until the domain cookie used to save the users decision in days | 31
 | cpc_type | Specifies the type (the layout) of the Cookie Preference Center. Currently, two types are supported: 'standard' and 'tabs'. Depending on this parameter additional label configuration may be necessary. See section <<Full Label Configuration>> for details. | standard
-| customPurposes | Array of custom purposes defined by publisher. IDs for custom purposes may range from 25-88. | none
+| customPurposes | Array of custom purposes defined by publisher. IDs for custom purposes may range from 25-88. | None
+| customVendorListUrl | Custom vendor list ('non IAB vendors') to use, will be loaded at the same time as the iabVendorList. | None
 | default_to_optin | Signal opt-in to vendors while still displaying the Opt-In layer to the end user | false
 | gdpr_applies_globally | Flag to indicate that publisher is from the EU, thus showing the OIL layer to every user. The flag is passed to vendors. | true
 | iabVendorBlacklist | Array of vendor IDs to exclude from consent. <<blacklisting-and-whitelisting, Details here>> | None
 | iabVendorListUrl | Vendorlist to use | https://vendorlist.consensu.org/vendorlist.json
-| customVendorListUrl | Custom vendorlist ('publisher vendors') to use, will be loaded at the same time as the iabVendorList. | None
-| iabVendorWhitelist | Array of vendor IDs to include in consent. If it is set, values in `iabVendorBlacklist` are ignored. <<blacklisting-and-whitelisting, Details here>>. When white- or blacklisting you might also be interested in the `show_limited_vendors_only` parameter. | none
+| iabVendorWhitelist | Array of vendor IDs to include in consent. If it is set, values in `iabVendorBlacklist` are ignored. <<blacklisting-and-whitelisting, Details here>>. When white- or blacklisting you might also be interested in the `show_limited_vendors_only` parameter. | None
 | <<texts-locale-object,locale>> | Object including locale version, id and labels. You can define the standard labels for all legal texts and buttons and set a version for it. <<locale-object, See here for details>> | None
 | locale_url | As an alternative to passing a locale object, set this to a JSON file with the locale configuration. See link:https://github.com/as-ideas/oil/blob/master/test/fixtures/config/deDE_01_locale.json[See here for an example file] | None
 | persist_min_tracking | If minimum tracking should result in removing all OIL cookies from the users browser and close the layer and store this selection in the oil cookie. | true
 | poi_activate_poi | Activates or deactivates Power Opt-In. | false
-| poi_group_name | POI group name. POI only affects those sites with the same group name (mandatory if POI is activated). | none
+| poi_group_name | POI group name. POI only affects those sites with the same group name (mandatory if POI is activated). | None
 | poi_hub_origin | The origin of the hub.js installation | `https://unpkg.com`
 | poi_hub_path | The path to the hub.html installation on the origin, if any. | `/@ideasio/oil.js@{version}/release/current/hub.html`
 | poi_subscriber_set_cookie | Whether to set the SOI cookie on POI opt-ins or not. | true
@@ -336,7 +336,7 @@ When preview_mode is not set in configuration and no consent cookie is found, th
 
 With *iabVendorWhitelist* and *iabVendorBlacklist* you can exclude specific vendors from the consent (blacklist) or include only the ones you want (whitelist). You can only use one method at a time - either whitelist or blacklist.
 
-As an example, the vendorlist may contain vendors with vendor IDs 1 to 10. In the example the user accepts everything, he just pressed "OK". The consent-string would normally contain (by getVendorConsents) this data:
+As an example, the vendor list may contain vendors with vendor IDs 1 to 10. In the example the user accepts everything, he just pressed "OK". The consent-string would normally contain (by getVendorConsents) this data:
 
 .Default result from getVendorConsents without whitelist/blacklist
 [source,javascript]
@@ -433,23 +433,24 @@ If you do not interact with the Opt-In Layer, it will autohide after a fixed tim
 include::../../../src/scripts/userview/userview_config.js[tags=config-timeout]
 ----
 
-=== Custom vendors (publisher vendors)
+=== Custom vendors (non IAB vendors)
 Custom vendors are vendors not supporting the IAB standard.
-OIL.js supports a list of custom vendors. For each custom vendor you have to specify a Opt-In and a Opt-Out JavaScript snippet.
+OIL.js supports a list of custom vendors. For each custom vendor you have to specify an Opt-In and an Opt-Out JavaScript snippet.
 These snippets are evaluated when the user changes consent and on page load.
-You can add custom vendors via a file similar to the original vendorlist. You need to specifiy a custom ID and decide for the purposes on you own.
+You can add custom vendors via a file similar to the original vendor list (see https://vendorlist.consensu.org/vendorlist.json). You need to specify a unique custom vendor id and decide for the purposes required by the custom vendor on your own.
 
-* Please keep in mind, that every change to the custom vendorlist should result in an increase in the custom vendorlist version.
-* Enable CORS for the custom vendorlist, if you host it on a different domain, eg. for usage with POI.
+* Please keep in mind that every change to the custom vendor list should result in an increase in the custom vendor list version.
+* Enable CORS for the custom vendor list, if you host it on a different domain, e.g. for usage with POI.
 
+.OIL configuration parameter to include a custom vendor list from a URL
 [source,json]
 ----
 {
   "customVendorListUrl": "https://yourdomain.com/customvendorlist.json"
 }
 ----
 
-
+.Example for a custom vendor list
 [source,json]
 ----
 include::../../../src/assets/customvendors.json[]

etc/appConfig.js

@@ -34,44 +34,44 @@ module.exports = {
     chunks: ['oilstub', 'oil'],
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings.html'),
+    filename: 'demos/cpc-standard.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-standard.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-tabs.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-tabs.html'),
+    filename: 'demos/cpc-tabs.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-tabs.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-confirm-optout.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-confirm-optout.html'),
+    filename: 'demos/cpc-confirm-optout.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-confirm-optout.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-custom-purposes.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-custom-purposes.html'),
+    filename: 'demos/cpc-custom-purposes.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-custom-purposes.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-custom-vendors.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-custom-vendors.html'),
+    filename: 'demos/cpc-custom-vendors.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-custom-vendors.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-limited-vendors.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-limited-vendors.html'),
+    filename: 'demos/cpc-limited-vendors.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-limited-vendors.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-purposes-default.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-purposes-default.html'),
+    filename: 'demos/cpc-purposes-default.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-purposes-default.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
@@ -94,20 +94,26 @@ module.exports = {
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-e2e-locale.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-e2e-locale.html'),
+    filename: 'demos/cpc-e2e-locale.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-e2e-locale.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-poi.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-poi.html'),
+    filename: 'demos/cpc-integrated-in-page.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-integrated-in-page.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'
   }, {
-    filename: 'demos/advanced-settings-poi-integrated.html',
-    template: path.resolve(sourcePath, 'demos', 'advanced-settings-poi-integrated.html'),
+    filename: 'demos/cpc-poi.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-poi.html'),
+    chunks: ['oilstub', 'oil'],
+    chunksSortMode: 'dependency',
+    inject: 'head'
+  }, {
+    filename: 'demos/cpc-poi-integrated-in-page.html',
+    template: path.resolve(sourcePath, 'demos', 'cpc-poi-integrated-in-page.html'),
     chunks: ['oilstub', 'oil'],
     chunksSortMode: 'dependency',
     inject: 'head'

src/assets/customvendors.json

@@ -19,8 +19,8 @@
         1,
         2
       ],
-      "optInSnippet": "console.info('opt-in snippet for custom vendor CUSTOM_VENDOR_1 executed!')",
-      "optOutSnippet": "console.info('opt-out snippet for custom vendor CUSTOM_VENDOR_1 executed!')"
+      "optInSnippet": "console.info('opt-in snippet for CUSTOM_VENDOR_1 executed!')",
+      "optOutSnippet": "console.info('opt-out snippet for CUSTOM_VENDOR_1 executed!')"
     },
     {
       "id": 2,
@@ -39,26 +39,8 @@
         1,
         2
       ],
-      "optInSnippet": "console.info('opt-in snippet for custom vendor CUSTOM_VENDOR_2 executed!')"
-    },
-    {
-      "id": 3,
-      "name": "CUSTOM_VENDOR_3",
-      "policyUrl": "https://www.emerse.com/privacy-policy/",
-      "purposeIds": [
-        1,
-        2,
-        5
-      ],
-      "legIntPurposeIds": [
-        3,
-        5
-      ],
-      "featureIds": [
-        1,
-        2
-      ],
-      "optOutSnippet": "console.info('opt-out snippet for custom vendor CUSTOM_VENDOR_3 executed!')"
+      "optInSnippet": "console.info('opt-in snippet for CUSTOM_VENDOR_2 executed!')",
+      "optOutSnippet": "console.info('opt-out snippet for CUSTOM_VENDOR_2 executed!')"
     }
   ]
 }

src/demos/advanced-settings-confirm-optout.html → src/demos/cpc-confirm-optout.html

@@ -68,6 +68,5 @@
 
 <body>
 <div class="demoname">Group A Site A</div>
-<!--<div id="oil-preference-center"></div>-->
 </body>
 </html>