Webcam with imagesLoaded

by rusci

HTML

<script src="http://desandro.github.io/imagesloaded/imagesloaded.pkgd.min.js"></script>
<body>
    <img id="webcam" src="http://placehold.it/352x288&text=Loading..." data-url="http://10.86.12.227/sin-frontend/live/image?gate=00102&camera=1" width="352" height="288"/>
</body>

JavaScript

var imgLoad = imagesLoaded( '#webcam' );
imgLoad.on('always', refresh);

function refresh() {
    var url = $('#webcam').data('url') + '&random=' + parseInt(Math.random() * 100000)
    $('#webcam').attr('src', url);
    console.log('refresh', url);
    imgLoad.off('always', refresh);
    imgLoad = imagesLoaded( '#webcam' );
    imgLoad.on('always', refresh);
}

refresh();