forked from platypush/platypush
58 lines
1.6 KiB
JavaScript
58 lines
1.6 KiB
JavaScript
$(document).ready(function() {
|
|
var $imgContainer = $('.image-carousel').find('.carousel'),
|
|
$imgBackground = $('.image-carousel').find('.carousel-background'),
|
|
config = window.widgets['image-carousel'],
|
|
images = config.imageUrls,
|
|
processedImages = 0;
|
|
|
|
var shuffleImages = function() {
|
|
for (var i=images.length-1; i > 0; i--) {
|
|
var j = Math.floor(Math.random() * (i + 1));
|
|
var x = images[i];
|
|
images[i] = images[j];
|
|
images[j] = x;
|
|
}
|
|
};
|
|
|
|
var refreshImage = function() {
|
|
var nextImage = images[processedImages++];
|
|
var $oldImg = $imgContainer.find('img');
|
|
var $newImg = $('<img></img>')
|
|
.attr('src', nextImage)
|
|
.attr('alt', 'Could not load image')
|
|
.appendTo('body').hide();
|
|
|
|
$newImg.on('load', function() {
|
|
$oldImg.remove();
|
|
if ($newImg.width() > $newImg.height()) {
|
|
$newImg.css('width', '100%');
|
|
$imgBackground.css('background-image', '');
|
|
} else {
|
|
$imgBackground.css('background-image', 'url(' + nextImage + ')');
|
|
}
|
|
|
|
$newImg.css('max-height', '100%');
|
|
$newImg.remove().appendTo($imgContainer).show();
|
|
});
|
|
|
|
if (processedImages == images.length-1) {
|
|
shuffleImages();
|
|
processedImages = 0;
|
|
}
|
|
};
|
|
|
|
var initWidget = function() {
|
|
shuffleImages();
|
|
refreshImage();
|
|
setInterval(refreshImage,
|
|
'refresh_seconds' in config ? config.refresh_seconds * 1000 : 15000);
|
|
};
|
|
|
|
var init = function() {
|
|
initWidget();
|
|
};
|
|
|
|
init();
|
|
});
|
|
|