window.addEvent('domready', function() {

    var container = $('container');
    
    // PAGE ONE
     
    var page_one = $('page_one');
     
    var finger = $('finger');
    
    var help_button = $('help_button');
    
    container.setStyle('opacity', 0);
    
    var fade_container = new Fx.Tween(container, {duration: 500, wait: false}).start('opacity', 0, 1);
    
    function showRollover() {
        
        finger.setStyle('opacity', 0);
        
        finger.setStyle('margin-left', $random(400, 680));
        
        finger.setStyle('margin-top', $random(170, 250));
            
        new Fx.Tween(finger, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
        
            new Fx.Morph(finger, {duration: 1500, wait: false, transition: Fx.Transitions.Cubic.easeOut}).start({
                
                'margin-left': [finger.getStyle('margin-left'), 540],
                
                'margin-top': [finger.getStyle('margin-top'), 222]
                
            }).chain(function() {
    
                new Fx.Tween(finger, {duration: 1000, wait: false}).start('opacity', 1, 0).chain(function() {
            
                    showRollover();
                    
                });
            
            });
        
        });
        
    }
    
    showRollover();
    
    help_button.addEvent('click', gotoPageTwo);
    
    finger.addEvent('click', gotoPageTwo);
    
    function gotoPageTwo() {
    
        new Fx.Tween(page_one, {duration: 500, wait: false}).start('opacity', 1, 0).chain(function() {
        
            page_one.setStyle('display', 'none');
            
            page_two.setStyle('opacity', 0);
            
            page_two.setStyle('display', '');
            
            new Fx.Tween(page_two, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
        
                loadSnippet();
                
                moveProgress();
        
            });
                
        });
    
    }
    
    // PAGE TWO
    
    var page_two = $('page_two');

    var loading_snippet = $('loading_snippet');
    
    var instructions = $('instructions');
    
    var rating_type = $('rating_type');
    
    var passage = $('passage');
    
    var taken_from = $('taken_from');
    
    var type_info = $('type_info');
    
    var rate = $('rate');
    
    var rate_one = $('rate_one');
    
    var rate_two = $('rate_two');
    
    var rate_three = $('rate_three');
    
    var rate_four = $('rate_four');
    
    var rate_five = $('rate_five');
    
    var points = $('points');
    
    var more_points = $('more_points');
    
    var level = $('level');
    
    var progress_fill = $('progress_fill');
    
    var meter = $('meter');
    
    var footer = $('footer');
    
    var rating_low_description = $('rating_low_description');
    
    var rating_high_description = $('rating_high_description');
    
    types_info = new Array();
    
    types_info['pacing'] = 'Pacing refers to the actual layout of the text on the page. A scene with high pacing will have characteristics that move your eye down a page with the minimum amount of words.';
    
    types_info['density'] = 'Density refers to the complexity of the text. Text that has a high density rating should take you longer to read than text that has a low density rating.';
    
    types_info['action'] = 'Action refers to the level of physical motion that is taking place in a scene.';
    
    types_info['description'] = 'Description refers to the amount of descriptive language that the author uses in their writing.';
    
    types_info['dialog'] = 'Dialog refers to the amount of spoken text in a scene.';
    
    players_points = 0;
    
    if(orig_points > 0) {
    
        players_points = orig_points;
    
    }
    
    points.set('text', players_points);
    
    page_two.setStyle('display', 'none');    
    
    loading_snippet.setStyle('display', 'none');
    
    loading_snippet.setStyle('opacity', 0);
    
    instructions.setStyle('display', 'none');
    
    instructions.setStyle('opacity', 0);
    
    passage.setStyle('display', 'none');
    
    passage.setStyle('opacity', 0);
    
    taken_from.setStyle('display', 'none');
    
    taken_from.setStyle('opacity', 0);
    
    type_info.setStyle('display', 'none');
    
    type_info.setStyle('opacity', 0);
    
    rate.setStyle('opacity', 0);
    
    more_points.setStyle('opacity', 0);
                
    level.setStyle('display', 'none');
    
    level.setStyle('opacity', 0);
    
    progress_fill.setStyle('display', 'none');
    
    footer.setStyle('display', 'none');
    
    footer.setStyle('opacity', 0);
    
    function loadSnippet() {
    
        level.setStyle('display', 'none');

        loading_snippet.setStyle('display', '');
        
        new Fx.Tween(loading_snippet, {duration: 500, wait: false}).start('opacity', 0, 1);
    
        var snippet = new Request.JSON({
        
            url: 'get_passage.php',
        
            onComplete: function(snippet) {
            
                new Fx.Tween(loading_snippet, {duration: 500, wait: false}).start('opacity', loading_snippet.getStyle('opacity'), 0).chain(function() {
                
                    loading_snippet.setStyle('display', 'none');
                
                    showNewSnippet(snippet);
                    
                });
                
            }
            
        }).get();
        
    }
    
    function showNewSnippet(snippet) {
    
        current_snippet = snippet;
    
        instructions.setStyle('display', '');
    
        passage.setStyle('display', '');
    
        taken_from.setStyle('display', '');
        
        type_info.setStyle('display', '');
        
        footer.setStyle('display', '');
        
        rate.setStyle('display', '');
    
        rating_type.set('text', snippet.type);
        
        type_info.set('text', types_info[snippet.type]);
    
        passage.set('html', snippet.text);
        
        taken_from.set('text', snippet.title + ' - written by ' + snippet.author);
        
        rating_low_description.set('html', 'represents <br/> the lowest level of ' + snippet.type);
        
        rating_high_description.set('html', 'represents <br/> the highest level of ' + snippet.type);
        
        new Fx.Tween(type_info, {duration: 500, wait: false}).start('opacity', 0, 1);
           
        new Fx.Tween(instructions, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
    
            new Fx.Tween(passage, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
        
                new Fx.Tween(taken_from, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
                
                    new Fx.Tween(footer, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
                    
                        new Fx.Tween(rate, {duration: 500, wait: false}).start('opacity', 0, 1).chain(function() {
                    
                        });
                    
                    });
                
                });
        
            });
        
        });
        
        rate_clickable = true;
    
    }
    
    function setRateButtons() {
    
        setRateButton(rate_one, 1);
        
        setRateButton(rate_two, 2);
        
        setRateButton(rate_three, 3);
        
        setRateButton(rate_four, 4);
        
        setRateButton(rate_five, 5);
        
    }
    
    setRateButtons(); 
    
    function setRateButton(button, value, info) {
    
        button.addEvent('mouseover', function() {
        
            button.setStyle('background', 'url(\'img/rate_it_over.jpg\') no-repeat');
            
            button.setStyle('color', '#242424');
            
            button.setStyle('cursor', 'pointer');
            
        });
        
        button.addEvent('mouseout', function() {
  
            button.setStyle('background', 'url(\'img/rate_it_off.jpg\') no-repeat');
        
            button.setStyle('color', '#bbb');
            
        });
    
        button.addEvent('click', function() {
        
            if(rate_clickable == true) {
        
                rate_clickable = false;
            
                updatePoints(5);
                
                ratePassage(value);
                
                moveProgress();
                
                new Fx.Tween(more_points, {duration: 200, wait: false}).start('opacity', 0, 1).chain(function() {
                
                    new Fx.Tween(more_points, {duration: 200, wait: false}).start.delay(500, this, ['opacity', 1, 0]);
                    
                });
                
                new Fx.Tween(rate, {duration: 200, wait: false}).start('opacity', 1, 0);
                
                new Fx.Tween(footer, {duration: 500, wait: false}).start('opacity', 1, 0);
        
                new Fx.Tween(instructions, {duration: 500, wait: false}).start('opacity', 1, 0);
                
                new Fx.Tween(taken_from, {duration: 500, wait: false}).start('opacity', 1, 0);
                
                new Fx.Tween(type_info, {duration: 500, wait: false}).start('opacity', 1, 0);

                new Fx.Tween(passage, {duration: 1000, wait: false}).start('opacity', 1, 0).chain(function() {
            
                    instructions.setStyle('display', 'none');
                    
                    passage.setStyle('display', 'none');
                    
                    taken_from.setStyle('display', 'none');
                    
                    type_info.setStyle('display', 'none');
                    
                    if(players_points == 25) {
                    
                        showLevel('', 'Starting Out').chain(function() { loadSnippet() });
                    
                    } else if(players_points == 50) {
                    
                        showLevel('', 'Beginner').chain(function() { loadSnippet() });
                    
                    } else if(players_points == 100) {
                    
                        showLevel('', 'Player').chain(function() { loadSnippet() });
                    
                    } else if(players_points == 200) {
                    
                        showLevel('', 'Master').chain(function() { loadSnippet() });
                
                    } else if(players_points == 250) {
                    
                        showLevel('', 'Ultra Master').chain(function() { loadSnippet() });
                    
                    } else {
                    
                        loadSnippet();
                
                    }
                
                });
                
            }
            
        });
    
    }
    
    function showLevel(photo, title) {
        
        level.set('text', title);
        
        level.setStyle('display', '');
        
        var chain = new Fx.Tween(level, {duration: 200, wait: false}).start('opacity', 0, 1).chain(function() {
        
            new Fx.Tween(level, {duration: 500, wait: false}).start.delay(500, this, ['opacity', 1, 0]);
            
        })
    
        return chain;
    
    }
    
    function updatePoints(value) {
    
        players_points = players_points + value;
    
        points.set('text', players_points);
    
    }
    
    function moveProgress() {
    
        progress_fill.setStyle('display', '');
    
        var fill_points = players_points;
                
        if(fill_points > 250) {
        
           fill_points = 250;
        
        }
        
        new Fx.Tween(progress_fill, {duration: 1500, wait: false}).start('width', (fill_points * 3.52));
        
        new Fx.Tween(meter, {duration: 1500, wait: false}).start('margin-left', (fill_points * 3.52)  + -8);
    
    }
    
   function ratePassage(value) {
    
        var rateThatPassage = new Request({url: 'rate_it.php', method: 'post',  onSuccess: function(responseText) { errorCheck(responseText); }}).send('time=' + current_snippet.retrieve_time + '&rating=' + value + '&snippet_id=' + current_snippet.id + '&points=' + players_points + '&metric=' + current_snippet.type);    
    
    }
    
    function errorCheck(responseText) {
    
    	if(responseText != '') {
    	
    		alert('There was an error adding your points, please reload the page :(');
    	
    	}
    
    }
    
});