document.sequenceloaded = {}
document.loading = false

function initSlideShow(sequencename, numframes) {
    document.sequencename = sequencename
    document.currentframe = 0
    document.numberframes = numframes
    displayImage()
}

function prevImage() {
    frame = document.currentframe - 1
    if (frame >= 0) {
        document.currentframe = frame
        displayImage()
    }
}

function nextImage() {
    frame = document.currentframe + 1
    if (frame < document.numberframes) {
        document.currentframe = frame
        displayImage()
    }
}

function twoDigits(i) {
    var istr = (i >= 10)? '' : '0'
    return istr + i
}

function displayImage() {
    var path = 'sequences/' + document.sequencename + '/'
    var curframe = twoDigits(document.currentframe)
    var img = 'frame_' + curframe + '.jpg'
    document.getElementsByName('original')[0].src = path + 'original/' + img
    document.getElementsByName('chess')[0].src = path + 'chess/' + img
    frametxt = (document.currentframe)? curframe + ' of ' + twoDigits(document.numberframes - 1) : 'KEYFRAME'
    document.getElementById('framenr').innerHTML = frametxt
}

function twoDigits(i) {
    var istr = (i >= 10)? '' : '0'
    return istr + i
}

function loadSequence(name, numframes) {
    if (document.loading) {
        mompl()
        return
    }

    if (document.sequenceloaded[name] != undefined) {
        initSlideShow(name, numframes)
        return
    }

    progressBar(0, 1, 10)
    document.loading = true
    document.sequencename = name
    document.numberframes = numframes

    var imagesURLs = new Array()
    preImages = new Array()
    currCount = 0
    loaded = new Array()

    var path = 'sequences/' + name + '/'
    var txt = ''
    for (i=0; i<numframes; i++) {
        var curframe = twoDigits(i)
        var img = 'frame_' + curframe + '.jpg'
        var orgframe =   path + 'original/' + img
        var chessframe = path + 'chess/' + img
        imagesURLs.push(orgframe)
        imagesURLs.push(chessframe)
        txt += orgframe + '<br>'
        txt += chessframe + '<br>'
    }

    for (i = 0; i < imagesURLs.length; i++) { 
        preImages[i] = new Image()
        preImages[i].src = imagesURLs[i]
    }
    for (i = 0; i < preImages.length; i++) { 
        loaded[i] = false
    }
    checkLoad()
}
    
function progressBar(loaded, total, numsegments) {
    var i, bar, ne
    ns = Math.round(loaded/total*numsegments)
    bar = 'PRELOADING ['
    for (i=0; i<ns; i++) bar += '#';
    for (i=0; i<numsegments-ns; i++) bar += '.';
    bar += ']'
    document.getElementById('sequ_navi').innerHTML = bar
}

function mompl() {
    document.getElementById('sequ_navi').innerHTML = 'Please don\'t confuse me!'
}

function checkLoad() {
    if (currCount == preImages.length) {
        initNavigation()
        return
    }

    for (i = 0; i <= preImages.length; i++) {
        if (loaded[i] == false && preImages[i].complete) {
            loaded[i] = true
            progressBar(currCount, preImages.length, 10)
            currCount++
        }
    }
    setTimeout("checkLoad()", 200) 
}

function initNavigation() {
    var nav
    document.loading = false
    //~ alert('initNavigation> ' + document.loading)
    document.sequenceloaded[document.sequencename] = true
    nav =  '<a onClick="prevImage(); return false" href="#">&nbsp;&lt;&nbsp;</a>\n'
    nav += '<span id="framenr">KEYFRAME</span>\n'
    nav += '<a onClick="nextImage(); return false" href="#">&nbsp;&gt;&nbsp;</a>\n'
    document.getElementById('sequ_navi').innerHTML = nav
    initSlideShow(document.sequencename, document.numberframes)
}