Security News
tea.xyz Spam Plagues npm and RubyGems Package Registries
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
@dmstr/cookie-consent
Advanced tools
Readme
It allows the user to choose through his active consent if the page can or not use/render/register features that could collect users personal data.
<script src="cookie-consent.js"></script>
var cc = new CookieConsent();
or
var cc = new CookieConsent({
name: 'cookie_consent_status',
path: '/',
domain: '',
expiryDays: 365
});
<!-- popup toggle buttons (for convenience) -->
<button class="cookie-consent-open">open</button>
<button class="cookie-consent-close">close</button>
<button class="cookie-consent-toggle">toggle</button>
<button class="cookie-consent-controls-open">Open controls</button>
<button class="cookie-consent-controls-close">Close controls</button>
<button class="cookie-consent-controls-toggle">Toggle controls</button>
<button class="cookie-consent-details-open">Open Details</button>
<button class="cookie-consent-details-close">Close Details</button>
<button class="cookie-consent-details-toggle">Toggle details</button>
<!-- the popup that will appear if no consent cookie where saved -->
<div class="cookie-consent-popup">
<div>
<span class="cookie-consent-message">We are using cookies</span>
<a class="cookie-consent-link" href="#">Learn more</a>
<button class="cookie-consent-accept-all">Accept All</button>
<button class="cookie-consent-deny-all">Deny All</button>
<button class="cookie-consent-controls-open">Open controls</button>
<button class="cookie-consent-controls-close">Close controls</button>
</div>
<div class="cookie-consent-controls open">
<label><input type="checkbox" data-cc-consent="statistics">Statistics</label>
<label><input type="checkbox" data-cc-consent="extern-media">Extern Media</label>
<button class="cookie-consent-save">SAVE</button>
</div>
<div class="cookie-consent-details open">
<h2>Statistics</h2>
<table style="width:100%">
<tr>
<td>Name</td>
<td>Statistics</td>
</tr>
<tr>
<td>Goal</td>
<td>Create statistics data</td>
</tr>
<tr>
<td>Cookie Names</td>
<td>_ga, _gat, _gid, _gali</td>
</tr>
</table>
</div>
</div>
<script src="../../dist/cookie-consent.js"></script>
<script>
var cc = new CookieConsent()
</script>
.cookie-consent-popup {
animation-name: show;
animation-duration: 1s;
animation-timing-function: ease;
display: none;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 999999;
}
.cookie-consent-popup.open {
display: block;
opacity: 1;
animation-name: show;
animation-duration: 1s;
animation-timing-function: ease;
}
.cookie-consent-controls {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.5s ease-out;
-moz-transition: max-height 0.5s ease-out;
transition: max-height 0.5s ease-out;
}
.cookie-consent-controls.open {
max-height: 600px;
}
.cookie-consent-details {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.5s ease-out;
-moz-transition: max-height 0.5s ease-out;
transition: max-height 0.5s ease-out;
}
.cookie-consent-details.open {
max-height: 600px;
}
@keyframes show {
from {opacity: 0;}
to {opacity: 1;}
}
@keyframes hide {
from {opacity: 1;}
to {opacity: 0;}
}
option | description | default | type |
---|---|---|---|
name | Defines the cookie name that Cookie Consent will use to store the status of the consent | 'cookie_consent_status' | STRING |
path | Defines the cookie path | '/' | STRING |
domain | Defines the cookie domain | '' | STRING |
expiryDays | Defines the cookie exipration days | 365 | INT |
This Cookie Consent library works in a declarative approach. That mean that you just need to put the right classes in your html to get it working.
cookie-consent-popup
: The popup widget. It will take the class "open" when no consent cookie was saved or when its manually triggered.cookie-consent-controls
: container for the consent checkboxes (controls).cookie-consent-save
: save the data-cc-consent values of the checkboxes in its same namespace in the consent cookie.cookie-consent-accept-all
: check all consents controls and save.cookie-consent-deny-all
: uncheck all consents controls and save.cookie-consent-open
: opens the popup.cookie-consent-close
: closes the popup.cookie-consent-toggle
: toggles the popup.cookie-consent-controls-open
: opens the controlscookie-consent-controls-close
: closes the controlscookie-consent-controls-toggle
: toggles the controlscookie-consent-details-open
: opens the detailscookie-consent-details-close
: closes the detailscookie-consent-details-toggle
: toggles the detailsdata-cc-consent
: the consent name/value that will be stored in the consent cookie.data-cc-namespace
: used to group checkboxes and save buttons. In that way you can add different groups in different zones of your website without conflicting with other checkboxes or save buttons.cc.afterSave = function (cc) {
// clean google analytics cookies if we do not have the "statistics" consent by expiring them. Then reload the page
cc.clean({
'statistics': {
'cookies': [
{name: '_ga'},
{name: '_gat', domain: '', path: '/'},
{name: '_gid', domain: '', path: '/'}
]
}
})
window.location.reload()
}
FAQs
Library to address GDPR (The General Data Protection Regulation)
The npm package @dmstr/cookie-consent receives a total of 63 weekly downloads. As such, @dmstr/cookie-consent popularity was classified as not popular.
We found that @dmstr/cookie-consent demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.
Security News
UnitedHealth Group disclosed that the ransomware attack on Change Healthcare compromised protected health information for millions in the U.S., with estimated costs to the company expected to reach $1 billion.