function enablePlayPauseButton() {
    $('tube-top-play-pause').setStyle({ backgroundPosition: '0 -30px', cursor: 'pointer' });
    $('tube-top-play-pause').observe('mousedown', function() {
        this.readAttribute('title') == 'Play' ? this.setStyle({ backgroundPosition: '0 -60px' }) : this.setStyle({ backgroundPosition: '0 -120px' });
    });
    $('tube-top-play-pause').observe('mouseout', function() {
        this.readAttribute('title') == 'Play' ? this.setStyle({ backgroundPosition: '0 -30px' }) : this.setStyle({ backgroundPosition: '0 -90px' });
    });
    $('tube-top-play-pause').observe('click', function() {
        if (this.readAttribute('title') == 'Play') {
            this.setStyle({ backgroundPosition: '0 -90px' }).writeAttribute('title', 'Pause');
            player.playVideo();
        } else {
            this.setStyle({ backgroundPosition: '0 -30px' }).writeAttribute('title', 'Play');
            player.pauseVideo();
        }
    });
}

function renderPlaylist(data) {
    var existingOptions = $('video-select').childElements();
    $('video-select').update(existingOptions[0]);

    var content = data.feed.entry.collect(function(anEntry) {
        var optionInfo = {};
        optionInfo.value = anEntry.media$group.media$content.find(function(aValue) { 
            return aValue.yt$format == 5;
        }).url;
        optionInfo.content = anEntry.title.$t;
        return '<option value="#{value}">#{content}</option>'.interpolate(optionInfo);
    }).join('');
    $('video-select').insert({ bottom: content });

    $('video-select').insert({ bottom: existingOptions[1] });
    $('video-select').selectedIndex = 0;
    
    $('video-select').observe('change', function() {
        if ($F('video-select') == '0') {
            $$('#tube-top-form p')[1].hide();
            player.stopVideo();
            player.clearVideo();
            $('tube-top-play-pause').setStyle({ backgroundPosition: '0 0', cursor: 'default' }).writeAttribute('title', 'Play');
            $('tube-top-play-pause').stopObserving();
        } else if ($F('video-select') == '-1') {
            $$('#tube-top-form p')[1].show();
            $('youtube-url-field').activate();
        } else {
            $$('#tube-top-form p')[1].hide();
            enablePlayPauseButton();
            player.loadVideoByUrl($F('video-select'));
        }
    });
}

document.observe('dom:loaded', function() {
    $('content').insert(new Element('script', { type: 'text/javascript', src: 'http://gdata.youtube.com/feeds/api/playlists/C76011ABB9DE5024?alt=json-in-script&callback=renderPlaylist&key=AI39si7jPbFnKtSy2Cf-VAfrNmxySUMf9IQLBtiI_-p65Mxol6d9E-YVhpHGSDx4B5DlmVbhtDb32yWUdVwV3D7ABrGeZsnOiQ', charset: 'UTF-8' }));
    
    $('tube-top-form').observe('submit', function(anEvent) {
        anEvent.stop();
        if ($('youtube-url-field').present()) {
            $$('#tube-top-form input[type="button"]').first().click();
        }
    });
    
    $('youtube-url-field').observe('keyup', function() {
        $('youtube-url-field').present() ? $$('#tube-top-form input[type="button"]').first().enable() : $$('#tube-top-form input[type="button"]').first().disable();
    });
    
    $$('#tube-top-form input[type="button"]').first().observe('click', function() {
        enablePlayPauseButton();
        player.loadVideoById($F('youtube-url-field').toQueryParams().v);
    });
});



document.observe('dom:loaded', function() {
    $('vision-disorder-select').observe('change', function() {
        $$('#vision-disorder-layers li img').invoke('hide');
        if ($F('vision-disorder-select') != '-1') {
            $$('#vision-disorder-layers li img')[parseInt($F('vision-disorder-select'), 10)].show().setStyle({ width: '480px', height: '320px' });
        }
    });
});



function youTubeChromelessPlayerStateChanged(aState) {
    switch (aState) {
        case 0:
            $('tube-top-play-pause').setStyle({ backgroundPosition: '0 -30px' }).writeAttribute('title', 'Play');
            break;
        case 1:
            $('tube-top-play-pause').setStyle({ backgroundPosition: '0 -90px' }).writeAttribute('title', 'Pause');
            break;
        case 2:
            $('tube-top-play-pause').setStyle({ backgroundPosition: '0 -30px' }).writeAttribute('title', 'Play');
            break;
        case 3:
            $('tube-top-play-pause').setStyle({ backgroundPosition: '0 -90px' }).writeAttribute('title', 'Pause');
            break;
        case 5:
            $('tube-top-play-pause').setStyle({ backgroundPosition: '0 -30px' }).writeAttribute('title', 'Play');
            break;
    }
}

function onYouTubePlayerReady(aPlayerID) {
    $$('#tube-top-form select').invoke('enable');
    
    player = $('you-tube-chromeless-player');
    player.addEventListener('onStateChange', 'youTubeChromelessPlayerStateChanged');
}

new PeriodicalExecuter(function(aPeriodicalExecuter) {
    if (window.swfobject != undefined) {
        aPeriodicalExecuter.stop();
        swfobject.embedSWF('http://www.youtube.com/apiplayer?enablejsapi=1', 'you-tube-chromeless-player', '480', '320', '8', '/swfs/expressInstall.swf', false, { allowScriptAccess: 'always', wMode: 'opaque' });
    }
}, 0.001);

document.observe('dom:loaded', function() {
    $$('head').first().insert(new Element('script', { type: 'text/javascript', src: '/javascripts/site/swfobject.js', charset: 'UTF-8' }));
});