﻿var TrainerTVPage = new Class({
    Implements: Options,
    options: {
        dataUrl: 'data/trainertv.aspx',
        videoRoot: 'http://d3r33qgzufzbhd.cloudfront.net/'
    },

    initialize: function() {
        this.trainers = $('trainers');
        this.videos = $('videos');
        this.videoContainer = $('videoContainer');
        this.trainerInfo = $('trainerinfo');
        this.featured = $('programlist');
        this.filter = '';
        this.loadTrainers();
        this.loadFeatured();
    },
    
    applyFilter: function(filter) {
        this.filter = filter;
        this.loadTrainers();
    },
    
    loadTrainers: function() {
        var url = this.options.dataUrl + '?type=trainers&filter=' + this.filter;
        new Request.JSON({ 'url': url, 'method': 'get',
            'onSuccess': function(result) {
                this.trainers.empty();
                this.videos.empty();
                this.trainerInfo.empty();
                if (result) {
                    result.each(function(item) {
                        new Element('img', { 'src': 'photo.aspx?t=tt&id=' + item.ID, 'rel': item.Fullname, 'events': {
                            'click': function() {
                                this.currentTrainer = item;
                                this.loadVideos();
                            }.bind(this)
                        }}).inject(this.trainers);
                    }.bind(this));
                    
                    new Top10Tooltip($$('div#trainers img'));
                }
            }.bind(this)}).send();
    },
    
    loadVideos: function() {
        if (!this.currentTrainer) {
            this.videos.empty();
            this.videoContainer.setStyle('display', 'none');
            return;
        }
        
        var url = this.options.dataUrl + '?type=videos&id=' + this.currentTrainer.ID;
        new Request.JSON({ 'url': url, 'method': 'get',
            'onSuccess': function(result) {
                this.videos.empty();
                this.trainerInfo.empty();
                this.videoContainer.setStyle('display', 'block');

                new Element('a', { 'href': 'trainer.aspx?id=' + this.currentTrainer.ID }).set('text', 'View profile').inject(
                    new Element('div', { 'class': 'profile' }).inject(this.trainerInfo));
                new Element('div', { 'class': 'trainer' }).set('text', this.currentTrainer.Fullname).inject(this.trainerInfo);
                
                if (result) {
                    this.currentID = result[0];
                    var count = 1;
                    result[1].each(function(item) {
                        if (count > 1 ) new Element('div', { 'class': 'separator' }).inject(this.videos);
                        var wrapper = new Element('div', { 'class': 'item' }).inject(this.videos);
                        new Element('img', { 'class': 'number', 'src': 'images/workout_videos/' + count.toString() + '.jpg' }).inject(wrapper);
                        new Element('img', { 'class': 'thumb', 'src': 'photo.aspx?t=vt&id=' + item.ID, 'styles': { 'cursor': 'pointer' }, 'events': { 'click': function() { this.view(item); }.bind(this) }}).inject(wrapper);
                        new Element('div', { 'class': 'description' }).set('text', item.Description).inject(wrapper);
                        new Element('div', { 'class': 'name' }).set('text', item.TrainerName).inject(wrapper);
                        new Element('img', { 'class': 'preview', 'src': 'images/button_view.jpg', 'events': { 'click': function() { this.view(item); }.bind(this) }}).inject(wrapper);
                        new Element('div', { 'class': 'clear' }).inject(wrapper);
                        
                        
                        count++;
                    }.bind(this));
                }
            }.bind(this), 'onFailure': function(result) {
        }.bind(this)}).send();
    },
    
    view: function(item) {
        var s1 = new SWFObject('swf/player-licensed.swf','player','550','360','9');
        s1.addParam('allowfullscreen','true');
        s1.addParam('allowscriptaccess','always');
        s1.addParam('wmode', 'transparent');
        s1.addParam('flashvars','autostart=true&file=' + this.options.videoRoot + escape(item.SDPath) + '&image=photo.aspx%3Ft=vt%26id=' + item.ID);
        s1.write('player');
    },
    
    loadFeatured: function() {
        var url = this.options.dataUrl + '?type=featured';
        new Request.JSON({ 'url': url, 'method': 'get',
            'onSuccess': function(result) {
                if (result) {
                    this.featured.empty();

                    result.each(function(item) {
                        var wrapper = new Element('div', { 'class': 'homeresult' }).inject(this.featured);
                        new Element('img', { 'class': 'thumb', 'src': 'photo.aspx?t=vt&id=' + item.ID, 'styles': { 'cursor': 'pointer' }, 'events': { 'click': function() { this.view(item); }.bind(this) }}).inject(wrapper);
                        var detail = new Element('div', { 'class': 'detail' }).inject(wrapper);
                        new Element('div', { 'class': 'news_search' }).set('text', item.Name).inject(detail);
                        new Element('div', { 'class': 'news_search_text' }).set('text', item.CategoryName).inject(detail);
                        new Element('img', { 'src': 'images/button_view.jpg', 'class': 'rollover', 'events': {
                            'click': function() { this.view(item); }.bind(this)
                        }}).inject(detail);
                    }.bind(this));
                }
            }.bind(this)}).send();
    }
});

var trainerTV;
window.addEvent('domready', function() {
    trainerTV = new TrainerTVPage();
});

