Hi,

Can someone please help me with the following navigation script I'm
trying to use on my page?  I have a list of sites in the left div
which I would like to be able to filter out.  The issue is that it
works only once.  Once I filter once I can't reclick on the "Refine by
category" button and change categories or go back to showing all
categories.  I'm guessing it's something to do with inner functions,
which I don't know enough about yet.  Any help would be greatly
appreciated.

The site is live at http://pranshuarya.com/test/pthesis.

The script:

<script type="text/javascript">
$(document).ready(function() {
        $('#portfolio').hide();
        $('#pfolio_close').hide();
        $('#categories').hide();
        $('#pfolio').click(function() {
                $.throbberShow({image:'images/ajax-loader.gif', 
parent:'#sites'});
                $('#portfolio').show('slow');
                $('#pfolio_close').show('slow');
                $('#sites').empty();
                $('#site_details').empty();
                $('#sites').append('<div id="sites_border"></div>');
                $('#sites').append('<div id="refine_by">Refine by 
category</div>');
                $('#site_details').append('<div 
id="site_details_lower_border"></
div>');

                $('#sites').append('<ul>');
                $.get('data.php',function(data) {
                        $(data).find('site').each(function() {
                                var $entry = $(this);
                                var $site_title = 
$entry.find('site_title').text();
                                var html_site = '<li>' + $site_title + '</li>';
                                $('#sites ul').append($(html_site));
                        });
                });

        var showsites = function() {
                $.get('data.php',function(data) {
                        $('#sites ul li').bind('click',function() {
                                var index = $('#sites ul li').index(this);
                                $('#site_details').empty();
                                $('#site_details').append('<div 
id="site_details_lower_border"></
div>');
                                $('li:not(this)').removeClass('selected');
                                $(this).addClass('selected');
                                $imageURL = 
$(data).find('imageURL').eq(index).text();
                                $skills = 
$(data).find('skills_used').eq(index).text();
                                $siteURL = 
$(data).find('siteURL').eq(index).text();

                                var html_image = '<div><a href="' + $siteURL + 
'"><img src="' +
$imageURL + '" /></a></div>';
                                $('#site_details').append($(html_image));
                                $('#site_details div').addClass('screenshot');

                                if($(data).find('imageURL2').eq(index).text() 
!= '') {
                                        $imageURL2 = 
$(data).find('imageURL2').eq(index).text();
                                        var html_image2 = '<div>';
                                        if($(data).find('siteURL2').eq(index)) {
                                                $siteURL2 = 
$(data).find('siteURL2').eq(index).text();
                                                html_image2 += '<a href="' + 
$siteURL2 +'"><img src="' +
$imageURL2 + '" /></a></div>';
                                                }
                                        else
                                                html_image2 += '<a href="' + 
$siteURL +'"><img src="' +
$imageURL2 + '" /></a></div>';
                                        
$('#site_details').append($(html_image2));
                                        $('#site_details 
div').addClass('screenshot');
                                        }
                                else
                                        $('#site_details 
div.screenshot').removeClass
('screenshot').addClass('screenshot_single');

                                $('a...@href^=http]').attr({'target': 
'_blank'}).attr({'title':
'Visit site'});

                                if($(data).find('description').eq(index)) {
                                        $desc = 
$(data).find('description').eq(index).text();
                                        var html_desc = '<div 
id="description">' + $desc + '</div>';
                                        $('#site_details').append($(html_desc));
                                        }
                                if($(data).find('site_details').eq(index) != 
'') {
                                        $details = 
$(data).find('site_details').eq(index).text();
                                        var html_details = '<div 
id="details"><br />' + $details + '</
div>';
                                        
$('#site_details').append($(html_details));
                                        }

                                var html_skills = '<div 
id="skills"><strong>Skills used:</
strong><br />' + $skills + '</div>';
                                $('#site_details').append($(html_skills));
                        });
                });
        };
        showsites();

                $.get('categories.php',function(cats) {
                        $('#refine_by').click(function() {
                        $('#categories').show('slow');
                        $('#categories').append('<ul>');
                        $('#categories ul').append('<li id="all">All</li>');
                                $(cats).find('categories').each(function() {
                                        var $entry = $(this);
                                        var $cat = 
$entry.find('category').text();
                                        var category = '<li>' + $cat + '</li>';
                                        $('#categories ul').append($(category));
                                        });

                $.get('data.php',function(data) {
                        $('#categories ul li').bind('click',function() {
                                        var index = $('#categories ul 
li').index(this);
                                        var $category = 
$(cats).find('category').eq(index).text();
                                        $('#sites').empty();
                                        $('#sites').append('<div 
id="sites_border"></div>');
                                        $('#sites').append('<div 
id="refine_by">Refine by category</
div>');
                                        $('#sites').append('<ul>');
                                        $sites = 
$(data).find('categories').filter(':contains
(JavaScript)');
                                        $sites.each(function() {
                                                var $entry = $(this).parent();
                                                var $site_title = 
$entry.find('site_title').text();
                                                var html_site = '<li>' + 
$site_title + '</li>';
                                                $('#sites 
ul').append($(html_site));
                                        });
                                        $('#categories').hide('slow');
                                        showsites();
                                        });
                                });
                        });
                });

        $('#pfolio_close').click(function() {
                $('#portfolio').hide('slow');
                $('#pfolio_close').hide('slow');
        });
        });
});
</script>

Let me know of any other information I can provide to be helpful.


Thanks,
Precar.

Reply via email to