if (typeof $Page == "undefined") var $Page = {


    loadPage: function (data, page, container, callback) {
        if (!page) {
            page = 1;
        }

        var html_pages = '';

        for (x in data['range']) {
            var p = data['range'][x];
            html_pages += '&nbsp;' + ( (p != page) ? '<a href="#" title="' + p + '">' + p + '</a>' : '<b>' + p + '</b>' );
        }
       

        if (data['total'] > 1){
            // pager format :
            //[First] [Previous] 2 3 4 5 6 of 7 [Next] [Last]

            var first = '';
            var previous = '';
            if (page > 1){
                first   = '[<a href="#" title="1">'+$Lang.tr("First")+'</a>]';
                var link_previous = parseInt(page) - 1;
                previous = '[<a href="#" title="' + link_previous + '">'+$Lang.tr("Previous")+'</a>]';
            }

            var next = '';
            var last = '';
            if (page < data['total'] ){
                var link_next = parseInt(page) +  1;
                next = '[<a href="#" title="'+link_next+'">'+$Lang.tr("Next")+'</a>]';
                last = '[<a href="#" title="'+data['total']+ '">'+$Lang.tr("Last")+'</a>]';
            }



            html_pages = first + previous + html_pages+' '+$Lang.tr("of")+' '+data['total']+' '+ next + last;
            $('#' + container).addClass('pages-container');
        }

         
      
        $('#' + container).html(html_pages).show().find('a').click(function() {
           callback($(this).attr('title'));
        });
        $('#' + container).find('a').each(function(){
           $(this).css("text-decoration", "none");
        });


        return data['items'];
    }


}