From 76ec5ba9e6bc2ad411cc2b9e5f0da6b6308245aa Mon Sep 17 00:00:00 2001 From: Sean Teague Date: Wed, 17 Jun 2020 10:25:21 +0200 Subject: [PATCH] Overlay develop feature (#71) Thanks again @Steague --- README.md | 93 +++++++++++++++++++++++++++------------------ images/overlay.png | Bin 0 -> 25377 bytes src/index.d.ts | 3 ++ src/index.js | 44 ++++++++++++++++----- 4 files changed, 95 insertions(+), 45 deletions(-) create mode 100644 images/overlay.png diff --git a/README.md b/README.md index 7d315a6..1b10ca3 100644 --- a/README.md +++ b/README.md @@ -111,42 +111,45 @@ If the decline button is enabled then the (onDecline) prop function can be used, ## Props -| Prop | Type | Default value | Description | -| ------------------------ | :-------------------------------: | ------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------- | -| location | string, "top", "bottom" or "none" | "bottom" | Syntactic sugar to easily enable you to place the bar at the top or the bottom of the browser window. Use "none" to disable. | -| children | string or React component | | Content to appear inside the bar | -| disableStyles | boolean | false | If enabled the component will have no default style. (you can still supply style through props) | -| hideOnAccept | boolean | true | If disabled the component will not hide it self after the accept button has been clicked. You will need to hide yourself (see onAccept) | -| acceptOnScroll | boolean | false | Defines whether "accept" should be fired after the user scrolls a certain distance (see acceptOnScrollPercentage) | -| acceptOnScrollPercentage | number | 25 | Percentage of the page height the user has to scroll to trigger the accept function if acceptOnScroll is enabled | -| buttonText | string or React component | "I understand" | Text to appear on the button | -| declineButtonText | string or React component | "I decline" | Text to appear on the decline button | -| cookieName | string | "CookieConsent" | Name of the cookie used to track whether the user has agreed. | -| cookieValue | string or boolean or number | true | Value to be saved under the cookieName. | -| declineCookieValue | string or boolean or number | false | Value to be saved under the cookieName when declined. | -| setDeclineCookie | boolean | true | Whether to set a cookie when the user clicks "decline" | -| onAccept | function | `({ acceptedByScrolling }) => {}` | Function to be called after the accept button has been clicked. | -| onDecline | function | `() => {}` | Function to be called after the decline button has been clicked. | -| debug | boolean | undefined | Bar will be drawn regardless of cookie for debugging purposes. | -| expires | number | 365 | Number of days before the cookie expires. | -| extraCookieOptions | object | `{}` | Extra info (apart from expiry date) to add to the cookie | -| containerClasses | string | "" | CSS classes to apply to the surrounding container | -| buttonClasses | string | "" | CSS classes to apply to the button | -| buttonWrapperClasses | string | "" | CSS classes to apply to the div wrapping the buttons | -| declineButtonClasses | string | "" | CSS classes to apply to the decline button | -| buttonId | string | "" | Id to apply to the button | -| declineButtonId | string | "" | Id to apply to the decline button | -| contentClasses | string | "" | CSS classes to apply to the content | -| style | object | [look at source][style] | React styling object for the bar. | -| buttonStyle | object | [look at source][buttonstyle] | React styling object for the button. | -| declineButtonStyle | object | [look at source][declinebuttonstyle] | React styling object for the decline button. | -| contentStyle | object | [look at source][contentstyle] | React styling object for the content. | -| disableButtonStyles | boolean | false | If enabled the button will have no default style. (you can still supply style through props) | -| enableDeclineButton | boolean | false | If enabled the decline button will be rendered | -| flipButtons | boolean | false | If enabled the accept and decline buttons will be flipped | -| ButtonComponent | React component | button | React Component to render as a button. | -| sameSite | string, "strict", "lax" or "none" | none | Cookies sameSite attribute value | -| cookieSecurity | boolean | undefined | Cookie security level. Defaults to true unless running on http. | +| Prop | Type | Default value | Description | +| ------------------------ | :-------------------------------: | --------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------- | +| location | string, "top", "bottom" or "none" | "bottom" | Syntactic sugar to easily enable you to place the bar at the top or the bottom of the browser window. Use "none" to disable. | +| children | string or React component | | Content to appear inside the bar | +| disableStyles | boolean | false | If enabled the component will have no default style. (you can still supply style through props) | +| hideOnAccept | boolean | true | If disabled the component will not hide it self after the accept button has been clicked. You will need to hide yourself (see onAccept) | +| acceptOnScroll | boolean | false | Defines whether "accept" should be fired after the user scrolls a certain distance (see acceptOnScrollPercentage) | +| acceptOnScrollPercentage | number | 25 | Percentage of the page height the user has to scroll to trigger the accept function if acceptOnScroll is enabled | +| buttonText | string or React component | "I understand" | Text to appear on the button | +| declineButtonText | string or React component | "I decline" | Text to appear on the decline button | +| cookieName | string | "CookieConsent" | Name of the cookie used to track whether the user has agreed. | +| cookieValue | string or boolean or number | true | Value to be saved under the cookieName. | +| declineCookieValue | string or boolean or number | false | Value to be saved under the cookieName when declined. | +| setDeclineCookie | boolean | true | Whether to set a cookie when the user clicks "decline" | +| onAccept | function | `({ acceptedByScrolling }) => {}` | Function to be called after the accept button has been clicked. | +| onDecline | function | `() => {}` | Function to be called after the decline button has been clicked. | +| debug | boolean | undefined | Bar will be drawn regardless of cookie for debugging purposes. | +| expires | number | 365 | Number of days before the cookie expires. | +| extraCookieOptions | object | `{}` | Extra info (apart from expiry date) to add to the cookie | +| overlay | boolean | false | Whether to show a page obscuring overlay or not. | +| containerClasses | string | "" | CSS classes to apply to the surrounding container | +| buttonClasses | string | "" | CSS classes to apply to the button | +| buttonWrapperClasses | string | "" | CSS classes to apply to the div wrapping the buttons | +| declineButtonClasses | string | "" | CSS classes to apply to the decline button | +| buttonId | string | "" | Id to apply to the button | +| declineButtonId | string | "" | Id to apply to the decline button | +| contentClasses | string | "" | CSS classes to apply to the content | +| overlayClasses | string | "" | CSS classes to apply to the surrounding overlay | +| style | object | [look at source][style] | React styling object for the bar. | +| buttonStyle | object | [look at source][buttonstyle] | React styling object for the button. | +| declineButtonStyle | object | [look at source][declinebuttonstyle] | React styling object for the decline button. | +| contentStyle | object | [look at source][contentstyle] | React styling object for the content. | +| overlayStyle | object | [look at source][overlaystyle] | React styling object for the overlay. | +| disableButtonStyles | boolean | false | If enabled the button will have no default style. (you can still supply style through props) | +| enableDeclineButton | boolean | false | If enabled the decline button will be rendered | +| flipButtons | boolean | false | If enabled the accept and decline buttons will be flipped | +| ButtonComponent | React component | button | React Component to render as a button. | +| sameSite | string, "strict", "lax" or "none" | none | Cookies sameSite attribute value | +| cookieSecurity | boolean | undefined | Cookie security level. Defaults to true unless running on http. | ## Debugging it @@ -268,12 +271,30 @@ If you're crazy enough you can even make a rainbow colored bar: ``` +#### Overlay + +![overlay](https://github.com/Mastermindzh/react-cookie-consent/blob/master/images/overlay.png?raw=true) + +You can also generate a page-obfuscating overlay that will prevent actions other than interacting with the cookie consent button(s). + +```js + + This website uses cookies to enhance the user experience. + +``` + [style]: https://github.com/Mastermindzh/react-cookie-consent/blob/master/src/index.js#L18-L29 [buttonstyle]: https://github.com/Mastermindzh/react-cookie-consent/blob/master/src/index.js#L30-L40 [declinebuttonstyle]: https://github.com/Mastermindzh/react-cookie-consent/blob/master/src/index.js#L41-L51 [contentstyle]: https://github.com/Mastermindzh/react-cookie-consent/blob/master/src/index.js#L52-L55 +[overlaystyle]: https://github.com/Mastermindzh/react-cookie-consent/blob/master/src/index.js#L62-L69 ## contributor information diff --git a/images/overlay.png b/images/overlay.png new file mode 100644 index 0000000000000000000000000000000000000000..099d726872ed4aa2977ccc3b7f232f5f2bf0f0d2 GIT binary patch literal 25377 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 RIvDi%FaLnU%tPTf{~Kyl&pH4A literal 0 HcmV?d00001 diff --git a/src/index.d.ts b/src/index.d.ts index ee0e1ad..0ee6536 100644 --- a/src/index.d.ts +++ b/src/index.d.ts @@ -35,6 +35,9 @@ export interface CookieConsentProps { enableDeclineButton?: boolean; flipButtons?: boolean; ButtonComponent?: React.ElementType; + overlay?: boolean, + overlayClasses?: string, + overlayStyle?: object, } export default class CookieConsent extends React.Component {} diff --git a/src/index.js b/src/index.js index 06760ed..b6405f1 100644 --- a/src/index.js +++ b/src/index.js @@ -59,6 +59,15 @@ class CookieConsent extends Component { flex: "1 0 300px", margin: "15px", }, + overlayStyle: { + position: "absolute", + left: 0, + top: 0, + width: "100%", + height: "100%", + zIndex: "999", + backgroundColor: "rgba(0,0,0,0.3)", + }, }; this.handleScroll = this.handleScroll.bind(this); @@ -226,12 +235,16 @@ class CookieConsent extends Component { enableDeclineButton, flipButtons, ButtonComponent, + overlay, + overlayClasses, + overlayStyle, } = this.props; let myStyle = {}; let myButtonStyle = {}; let myDeclineButtonStyle = {}; let myContentStyle = {}; + let myOverlayStyle = {}; if (disableStyles) { // if styles are disabled use the provided styles (or none) @@ -239,10 +252,12 @@ class CookieConsent extends Component { myButtonStyle = Object.assign({}, buttonStyle); myDeclineButtonStyle = Object.assign({}, declineButtonStyle); myContentStyle = Object.assign({}, contentStyle); + myOverlayStyle = Object.assign({}, overlayStyle); } else { // if styles aren't disabled merge them with the styles that are provided (or use default styles) myStyle = Object.assign({}, { ...this.state.style, ...style }); myContentStyle = Object.assign({}, { ...this.state.contentStyle, ...contentStyle }); + myOverlayStyle = Object.assign({}, { ...this.state.overlayStyle, ...overlayStyle }); // switch to disable JUST the button styles if (disableButtonStyles) { @@ -305,17 +320,23 @@ class CookieConsent extends Component { buttonsToRender.reverse(); } + const OverlayWrapper = !overlay + ? props => + : props =>
; + return ( -
-
- {this.props.children} + +
+
+ {this.props.children} +
+
+ {buttonsToRender.map(button => { + return button; + })} +
-
- {buttonsToRender.map((button) => { - return button; - })} -
-
+ ); } } @@ -356,6 +377,9 @@ CookieConsent.propTypes = { flipButtons: PropTypes.bool, ButtonComponent: PropTypes.elementType, cookieSecurity: PropTypes.bool, + overlay: PropTypes.bool, + overlayClasses: PropTypes.string, + overlayStyle: PropTypes.object, }; CookieConsent.defaultProps = { @@ -388,6 +412,8 @@ CookieConsent.defaultProps = { flipButtons: false, sameSite: SAME_SITE_OPTIONS.NONE, ButtonComponent: ({ children, ...props }) => , + overlay: false, + overlayClasses: "", }; export default CookieConsent;