Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

bulma-extensions

Package Overview
Dependencies
Maintainers
1
Versions
112
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

bulma-extensions - npm Package Compare versions

Comparing version 0.6.1 to 0.6.2

2

bulma-accordion/package.json
{
"name": "bulma-accordion",
"version": "0.2.0",
"version": "0.2.1",
"description": "A simple accordion extension for Bulma",

@@ -5,0 +5,0 @@ "main": "accordion.sass",

@@ -11,8 +11,7 @@ const MOUSE_EVENTS = ['click', 'touchstart'];

init() {
this.carouselContent = this.element.querySelector('.carousel-content');
this.items = this.carouselContent.querySelectorAll('.carousel-item');
this.items = Array.from(this.element.querySelectorAll('.carousel-item'));
MOUSE_EVENTS.forEach((event) => {
this.element.querySelector('.carousel-nav-left').addEventListener(event, (e) => {
this.prevSlide();
this.move('previous');
if (this.autoplayInterval) {

@@ -24,3 +23,3 @@ clearInterval(this.autoplayInterval);

this.element.querySelector('.carousel-nav-right').addEventListener(event, (e) => {
this.nextSlide();
this.move('next');
if (this.autoplayInterval) {

@@ -33,5 +32,5 @@ clearInterval(this.autoplayInterval);

this.setOrder();
this.initOrder();
if (this.element.dataset.autoplay && this.element.dataset.autoplay == "true") {
if (this.element.dataset.autoplay && this.element.dataset.autoplay == 'true') {
this.autoPlay(this.element.dataset.delay || 5000);

@@ -41,64 +40,66 @@ }

setOrder(direction){
// initialize direction to change order
if (direction === 'previous') {
direction = 1;
} else if (direction === 'next') {
direction = -1;
}
initOrder() {
const currentActiveItem = this.element.querySelector('.carousel-item.is-active');
const currentActiveItemPos = this.items.indexOf(currentActiveItem);
const length = this.items.length;
let nbItems = this.items.length;
if (nbItems) {
[].forEach.call(this.items, function(item, index) {
let newValue;
if (item.style.order) {
newValue = (parseInt(item.style.order, 10) + direction) % nbItems;
} else {
newValue = ((index + 2) % nbItems);
}
if (!newValue || newValue !== 2) {
item.style['z-index'] = '0';
item.classList.remove('is-active');
} else {
item.style['z-index'] = '1';
item.classList.add('is-active');
}
item.style.order = newValue ? newValue : nbItems;
});
if (currentActiveItemPos) {
this.items.push(this.items.splice(0, currentActiveItemPos));
} else {
this.items.unshift(this.items.pop());
}
this.setOrder();
}
prevSlide(evt) {
// add reverse
this.carouselContent.classList.add('carousel-reverse');
// Disable transition to instant change order
this.carouselContent.classList.toggle('carousel-animate');
// Change order of element
// Current order 2 visible become order 1
this.setOrder('previous');
// Enable transition to animate order 1 to order 2
setTimeout(() => {
this.carouselContent.classList.toggle('carousel-animate');
}, 50);
setOrder() {
this.items.forEach((item, index) => {
if (index !== 1) {
item.style['z-index'] = '0';
} else {
item.style['z-index'] = '1';
}
item.style.order = index;
});
}
nextSlide(evt) {
// remove reverse
this.carouselContent.classList.remove('carousel-reverse');
move(direction = 'next') {
if (this.items.length) {
const currentActiveItem = this.element.querySelector('.carousel-item.is-active');
let newActiveItem;
// Disable transition to instant change order
this.carouselContent.classList.toggle('carousel-animate');
// Change order of element
// Current order 2 visible become order 3
this.setOrder('next');
// Enable transition to animate order 3 to order 2
setTimeout(() => {
this.carouselContent.classList.toggle('carousel-animate');
}, 50);
};
currentActiveItem.classList.remove('is-active');
// initialize direction to change order
if (direction === 'previous') {
// Reorder items
this.items.unshift(this.items.pop());
// add reverse class
this.element.classList.add('is-reversing');
} else {
// Reorder items
this.items.push(this.items.shift());
// remove reverse class
this.element.classList.remove('is-reversing');
}
if (this.items.length >= 1) {
newActiveItem = this.items[1];
} else {
newActiveItem = this.items[0];
}
newActiveItem.classList.add('is-active');
this.setOrder();
// Disable transition to instant change order
this.element.classList.toggle('carousel-animated');
// Enable transition to animate order 1 to order 2
setTimeout(() => {
this.element.classList.toggle('carousel-animated');
}, 50);
}
}
autoPlay(delay = 5000) {
this.autoplayInterval = setInterval(() => {
this.nextSlide();
this.move('next');
}, delay);

@@ -108,7 +109,7 @@ }

document.addEventListener( 'DOMContentLoaded', function () {
document.addEventListener('DOMContentLoaded', function() {
var carousels = document.querySelectorAll('.carousel, .hero-carousel');
[].forEach.call(carousels, function(carousel) {
new Carousel(carousel);
new Carousel(carousel);
});
});

@@ -1,7 +0,9 @@

var MOUSE_EVENTS=["click","touchstart"],Carousel=function(a){this.element=a;this.init()};
Carousel.prototype.init=function(){var a=this;this.carouselContent=this.element.querySelector(".carousel-content");this.items=this.carouselContent.querySelectorAll(".carousel-item");MOUSE_EVENTS.forEach(function(b){a.element.querySelector(".carousel-nav-left").addEventListener(b,function(b){a.prevSlide();a.autoplayInterval&&(clearInterval(a.autoplayInterval),a.autoPlay(a.element.dataset.delay||5E3))},!1);a.element.querySelector(".carousel-nav-right").addEventListener(b,function(b){a.nextSlide();a.autoplayInterval&&
(clearInterval(a.autoplayInterval),a.autoPlay(a.element.dataset.delay||5E3))},!1)});this.setOrder();this.element.dataset.autoplay&&"true"==this.element.dataset.autoplay&&this.autoPlay(this.element.dataset.delay||5E3)};
Carousel.prototype.setOrder=function(a){"previous"===a?a=1:"next"===a&&(a=-1);var b=this.items.length;b&&[].forEach.call(this.items,function(c,e){var d;(d=c.style.order?(parseInt(c.style.order,10)+a)%b:(e+2)%b)&&2===d?(c.style["z-index"]="1",c.classList.add("is-active")):(c.style["z-index"]="0",c.classList.remove("is-active"));c.style.order=d?d:b})};
Carousel.prototype.prevSlide=function(a){var b=this;this.carouselContent.classList.add("carousel-reverse");this.carouselContent.classList.toggle("carousel-animate");this.setOrder("previous");setTimeout(function(){b.carouselContent.classList.toggle("carousel-animate")},50)};
Carousel.prototype.nextSlide=function(a){var b=this;this.carouselContent.classList.remove("carousel-reverse");this.carouselContent.classList.toggle("carousel-animate");this.setOrder("next");setTimeout(function(){b.carouselContent.classList.toggle("carousel-animate")},50)};Carousel.prototype.autoPlay=function(a){var b=this;this.autoplayInterval=setInterval(function(){b.nextSlide()},void 0===a?5E3:a)};
document.addEventListener("DOMContentLoaded",function(){var a=document.querySelectorAll(".carousel, .hero-carousel");[].forEach.call(a,function(a){new Carousel(a)})});
var $jscomp={scope:{}};$jscomp.defineProperty="function"==typeof Object.defineProperties?Object.defineProperty:function(a,b,c){if(c.get||c.set)throw new TypeError("ES3 does not support getters and setters.");a!=Array.prototype&&a!=Object.prototype&&(a[b]=c.value)};$jscomp.getGlobal=function(a){return"undefined"!=typeof window&&window===a?a:"undefined"!=typeof global&&null!=global?global:a};$jscomp.global=$jscomp.getGlobal(this);$jscomp.SYMBOL_PREFIX="jscomp_symbol_";
$jscomp.initSymbol=function(){$jscomp.initSymbol=function(){};$jscomp.global.Symbol||($jscomp.global.Symbol=$jscomp.Symbol)};$jscomp.symbolCounter_=0;$jscomp.Symbol=function(a){return $jscomp.SYMBOL_PREFIX+(a||"")+$jscomp.symbolCounter_++};
$jscomp.initSymbolIterator=function(){$jscomp.initSymbol();var a=$jscomp.global.Symbol.iterator;a||(a=$jscomp.global.Symbol.iterator=$jscomp.global.Symbol("iterator"));"function"!=typeof Array.prototype[a]&&$jscomp.defineProperty(Array.prototype,a,{configurable:!0,writable:!0,value:function(){return $jscomp.arrayIterator(this)}});$jscomp.initSymbolIterator=function(){}};$jscomp.arrayIterator=function(a){var b=0;return $jscomp.iteratorPrototype(function(){return b<a.length?{done:!1,value:a[b++]}:{done:!0}})};
$jscomp.iteratorPrototype=function(a){$jscomp.initSymbolIterator();a={next:a};a[$jscomp.global.Symbol.iterator]=function(){return this};return a};$jscomp.polyfill=function(a,b,c,d){if(b){c=$jscomp.global;a=a.split(".");for(d=0;d<a.length-1;d++){var f=a[d];f in c||(c[f]={});c=c[f]}a=a[a.length-1];d=c[a];b=b(d);b!=d&&null!=b&&$jscomp.defineProperty(c,a,{configurable:!0,writable:!0,value:b})}};
$jscomp.polyfill("Array.from",function(a){return a?a:function(a,c,d){$jscomp.initSymbolIterator();c=null!=c?c:function(a){return a};var b=[],e=a[Symbol.iterator];if("function"==typeof e)for(a=e.call(a);!(e=a.next()).done;)b.push(c.call(d,e.value));else for(var e=a.length,g=0;g<e;g++)b.push(c.call(d,a[g]));return b}},"es6-impl","es3");var MOUSE_EVENTS=["click","touchstart"],Carousel=function(a){this.element=a;this.init()};
Carousel.prototype.init=function(){var a=this;this.items=Array.from(this.element.querySelectorAll(".carousel-item"));MOUSE_EVENTS.forEach(function(b){a.element.querySelector(".carousel-nav-left").addEventListener(b,function(b){a.move("previous");a.autoplayInterval&&(clearInterval(a.autoplayInterval),a.autoPlay(a.element.dataset.delay||5E3))},!1);a.element.querySelector(".carousel-nav-right").addEventListener(b,function(b){a.move("next");a.autoplayInterval&&(clearInterval(a.autoplayInterval),a.autoPlay(a.element.dataset.delay||
5E3))},!1)});this.initOrder();this.element.dataset.autoplay&&"true"==this.element.dataset.autoplay&&this.autoPlay(this.element.dataset.delay||5E3)};Carousel.prototype.initOrder=function(){var a=this.element.querySelector(".carousel-item.is-active");(a=this.items.indexOf(a))?this.items.push(this.items.splice(0,a)):this.items.unshift(this.items.pop());this.setOrder()};Carousel.prototype.setOrder=function(){this.items.forEach(function(a,b){a.style["z-index"]=1!==b?"0":"1";a.style.order=b})};
Carousel.prototype.move=function(a){a=void 0===a?"next":a;var b=this;this.items.length&&(this.element.querySelector(".carousel-item.is-active").classList.remove("is-active"),"previous"===a?(this.items.unshift(this.items.pop()),this.element.classList.add("is-reversing")):(this.items.push(this.items.shift()),this.element.classList.remove("is-reversing")),(1<=this.items.length?this.items[1]:this.items[0]).classList.add("is-active"),this.setOrder(),this.element.classList.toggle("carousel-animated"),setTimeout(function(){b.element.classList.toggle("carousel-animated")},
50))};Carousel.prototype.autoPlay=function(a){var b=this;this.autoplayInterval=setInterval(function(){b.move("next")},void 0===a?5E3:a)};document.addEventListener("DOMContentLoaded",function(){var a=document.querySelectorAll(".carousel, .hero-carousel");[].forEach.call(a,function(a){new Carousel(a)})});
{
"name": "bulma-carousel",
"version": "0.2.8",
"version": "0.2.9",
"description": "Display a Image / Content carousel",

@@ -5,0 +5,0 @@ "main": "carousel.sass",

{
"name": "bulma-extensions",
"version": "0.6.1",
"version": "0.6.2",
"description": "Set of extensions for Bulma.io CSS Framework",

@@ -5,0 +5,0 @@ "main": "extensions.sass",

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc