@huluvu424242/honey-slideshow
Version:
Text to Speech component wich is reading texts from DOM elements.
110 lines (109 loc) • 3.14 kB
JavaScript
var spinners = {
'bubbles': {
dur: 1000,
circles: 9,
fn: function (dur, index, total) {
var animationDelay = (dur * index / total) - dur + "ms";
var angle = 2 * Math.PI * index / total;
return {
r: 5,
style: {
'top': 9 * Math.sin(angle) + "px",
'left': 9 * Math.cos(angle) + "px",
'animation-delay': animationDelay,
}
};
}
},
'circles': {
dur: 1000,
circles: 8,
fn: function (dur, index, total) {
var step = index / total;
var animationDelay = (dur * step) - dur + "ms";
var angle = 2 * Math.PI * step;
return {
r: 5,
style: {
'top': 9 * Math.sin(angle) + "px",
'left': 9 * Math.cos(angle) + "px",
'animation-delay': animationDelay,
}
};
}
},
'circular': {
dur: 1400,
elmDuration: true,
circles: 1,
fn: function () {
return {
r: 20,
cx: 48,
cy: 48,
fill: 'none',
viewBox: '24 24 48 48',
transform: 'translate(0,0)',
style: {}
};
}
},
'crescent': {
dur: 750,
circles: 1,
fn: function () {
return {
r: 26,
style: {}
};
}
},
'dots': {
dur: 750,
circles: 3,
fn: function (_, index) {
var animationDelay = -(110 * index) + 'ms';
return {
r: 6,
style: {
'left': 9 - (9 * index) + "px",
'animation-delay': animationDelay,
}
};
}
},
'lines': {
dur: 1000,
lines: 12,
fn: function (dur, index, total) {
var transform = "rotate(" + (30 * index + (index < 6 ? 180 : -180)) + "deg)";
var animationDelay = (dur * index / total) - dur + "ms";
return {
y1: 17,
y2: 29,
style: {
'transform': transform,
'animation-delay': animationDelay,
}
};
}
},
'lines-small': {
dur: 1000,
lines: 12,
fn: function (dur, index, total) {
var transform = "rotate(" + (30 * index + (index < 6 ? 180 : -180)) + "deg)";
var animationDelay = (dur * index / total) - dur + "ms";
return {
y1: 12,
y2: 20,
style: {
'transform': transform,
'animation-delay': animationDelay,
}
};
}
}
};
var SPINNERS = spinners;
export { SPINNERS as S };