// JavaScript Document
$(document).ready(function() {
    var no_of_slides = $('#slider_inner > li').length + 1;
    if (no_of_slides == 2) {
        $('#next').animate({ opacity: 'hide' }, 1000)
    }
    var slide_wid = 345;
    var total_wid = slide_wid * no_of_slides;
    var current_pos = 0;
    $('#prev').animate({ opacity: 'hide' }, 1000)
    $('#prev').css('cursor', 'pointer');
    $('#next').css('cursor', 'pointer');
    $('#slider_inner').css({
        'width': total_wid,
        'overflow': 'hidden'
    })
    var first_slide = $('#slider_inner > li:first').html();
    var last_slide = $('#slider_inner > li:last').html();
    var curr_cont = '';
    //for (i = 1; i < no_of_slides; i++) {
       // curr_cont += '<li>' + $('#slider_inner > li:nth-child(' + i + ')').html() + '</li>';
   // }
    $('#slider_inner').append('<li>' + first_slide + '</li>');
    //$('#slider_inner').prepend('<li>'+last_slide+'</li>');
    $('#prev').click(function() {
        if (current_pos == 1) {
            $('#prev').animate({ opacity: 'hide' }, 1000)
        }
        if (current_pos > 0) {
            $('#next').animate({ opacity: 'show' }, 1000)
            current_pos -= 1;
            var curr_pos = '-' + (slide_wid * current_pos);
            $('#slider_inner').animate({ marginLeft: curr_pos }, 1000)
        }
    })
    $('#next').click(function() {
        if (current_pos == (no_of_slides - 2)) {
            current_pos += 1;
            var curr_pos = '-' + slide_wid * current_pos;
            $('#slider_inner').animate({ marginLeft: curr_pos }, 1000, 'linear', function() {
                $('#slider_inner').css({
                    'margin-left': 0
                })
                current_pos = 0;
                $('#prev').animate({ opacity: 'hide' }, 1000)
            })
        }
        else {
            if (current_pos != (no_of_slides - 1)) {
                $('#prev').animate({ opacity: 'show' }, 1000)
                current_pos += 1;
                var curr_pos = '-' + slide_wid * current_pos;
                $('#slider_inner').animate({ marginLeft: curr_pos }, 1000)
            }

        }
        if (current_pos == (no_of_slides - 2)) {
            $('#next').animate({ opacity: 'hide' }, 1000)
        }
    })
})