refactoring home page

This commit is contained in:
Meutel 2014-06-22 12:23:16 +02:00
parent a190aab20d
commit f5b763ab38

View File

@ -1,8 +1,140 @@
var url;
var links;
var cols;
var headers;
var urlp={};
var ItemsCol = function(id, headers, cols) {
this.id = id;
this.url= '/'+id;
this.headers = headers;//table headers
this.cols = cols;//cell rendering functions
};
$.extend(ItemsCol.prototype,{
data: null, // loaded items
bind: function() {
var self = this;
$('#'+this.id) .click(function() {
window.location.hash=self.id;
home.pagination.page=0;
home.pagination.perpage=10;
self.load();
});
},
load: function() {
var self = this;
$.getJSON( this.url, home.pagination, function( data, textStatus, xhr ) {
self.data = data;
home.current = self;
home.update();
var linkHeader = xhr.getResponseHeader('link');
home.updatePager(parse_link_header(linkHeader));
});
},
renderRow: function(elt) {
var item = "<tr id='" + elt.id + "'>";
$.each(this.cols, function(icol, col) {
item+="<td>"+col(elt)+"</td>";
});
item += "</tr>";
return item;
},
});
var HomePage = function() {
this.books= new ItemsCol('book', ['Titre', 'Auteur(s)', 'Serie'], [
function(elt) {
return link(elt.title, '/book/'+elt.id, 'glyphicon-book');
},
function(elt) {
var links='';
if (Array.isArray(elt.authors)) {
$.each(elt.authors, function(ida, author) {
links+=link(author.name, '/author/'+author.id,'glyphicon-user');
});
}
return links;
},
function(elt) {
var content = elt.series_name == null ? '' : elt.series_name + '(' + elt.series_index + ')';
return link(content, '/serie/'+elt.series_id, 'glyphicon-list');
}
]);
this.authors= new ItemsCol('author', ['Nom', 'Livres'], [
function(elt){ return link(elt.name, '/author/'+elt.id,'glyphicon-user'); },
function(elt) { return elt.count; }
]);
this.series= new ItemsCol('serie', ['Nom', 'Auteur(s)', 'Livres'], [
function(elt) { return link(elt.name, '/serie/'+elt.id, 'glyphicon-list'); },
function(elt) {
var links='';
if (Array.isArray(elt.authors)) {
$.each(elt.authors, function(ida, author) {
links+=link(author.name, '/author/'+author.id,'glyphicon-user');
});
}
return links;
},
function(elt) { return elt.count; }
]);
this.pagination= {
perpage: 10,
page: 0,
};
this.table = $('#items');
// bind buttons events
$.each([this.books,this.authors,this.series], function(ind, itemsCol) {
itemsCol.bind();
});
$(".perpage").click(function() {
home.pagination.perpage = $(this).attr("value");
home.pagination.page = 0;
if (home.current)
home.current.load();
});
};
$.extend(HomePage.prototype,{
current: null,
table: null,
displayHeaders: function(headers) {
var row = "<tr>";
$.each(headers, function(ih, h) {
row+="<th>"+h+"</th>";
});
row += "</tr>";
this.table.append(row);
},
addRow: function(elt) {
var row = this.current.renderRow(elt);
this.table.append(row);
},
update: function() {
this.table.empty();
if (this.current) {
this.displayHeaders(this.current.headers);
var self = this;
$.each(this.current.data, function(ind, elt) {
self.addRow(elt);
});
}
},
updatePager: function(links) {
$.each(['prev','next'], function (i, elt) {
var btn = $('#'+elt);
if (links[elt]) {
btn.parent().removeClass('disabled');
} else {
btn.parent().addClass('disabled');
}
btn.click(function() {
var parsed = $.url(links[elt]);
var urlp = parsed.param();
home.pagination.page = urlp.page;
home.pagination.perpage = urlp.perpage;
home.current.load();
});
});
},
});
var home = new HomePage();
/**
* Make link.
*/
function link(content, href, glyph) {
var link="";
if (content) {
@ -12,101 +144,6 @@ function link(content, href, glyph) {
}
return link;
}
$('#book').click(function() {
headers = ['Titre', 'Auteur(s)', 'Serie'];
cols = [
function(elt) {
return link(elt.title, '/book/'+elt.id, 'glyphicon-book');
}, function(elt) {
var links="";
if (Array.isArray(elt.authors)) {
$.each(elt.authors, function(ida, author) {
links+=link(author.name, '/author/'+author.id,'glyphicon-user');
});
}
return links;
}, function(elt) {
var content = elt.series_name == null ? '' : elt.series_name + '(' + elt.series_index + ')';
return link(content, '/serie/'+elt.series_id, 'glyphicon-list');
}
];
});
$('#author').click(function() {
headers = ['Nom', 'Livres'];
cols = [ function(elt){
return link(elt.name, '/author/'+elt.id,'glyphicon-user');
}, function(elt) { return elt.count; } ];
});
$('#serie').click(function() {
headers = ['Nom', 'Auteur(s)', 'Livres'];
cols = [
function(elt) {
return link(elt.name, '/serie/'+elt.id, 'glyphicon-list');
}, function(elt) {
var links="";
if (Array.isArray(elt.authors)) {
$.each(elt.authors, function(ida, author) {
links+=link(author.name, '/author/'+author.id,'glyphicon-user');
});
}
return links;
}, function(elt) {
return elt.count;
}
];
});
$.each(['book','author','serie'], function (i, elt) {
$('#'+elt).click(function() {
window.location.hash=elt='s';
url = '/'+elt;
loadItems();
});
});
$.each(['prev','next'], function (i, elt) {
$('#'+elt).click(function() {
var parsed = $.url(links[elt]);
url = parsed.attr('path');
urlp = parsed.param();
loadItems();
});
});
$(".perpage").click(function() {
urlp.perpage = $(this).attr("value");
urlp.page = 0;
loadItems();
});
function loadItems() {
$.getJSON( url, urlp, function( data, textStatus, xhr ) {
var items = $('#items');
items.empty();
var item = "<tr>";
$.each(headers, function(ih, h) {
item+="<th>"+h+"</th>";
});
item += "</tr>";
items.append(item);
$.each( data, function(i, elt ) {
var item = "<tr id='" + elt.id + "'>";
$.each(cols, function(icol, col) {
item+="<td>"+col(elt)+"</td>";
});
item += "</tr>";
items.append(item);
});
var linkHeader = xhr.getResponseHeader('link');
links = parse_link_header(linkHeader);
$.each(['prev','next'], function (i, elt) {
var btn = $('#'+elt);
if (links[elt]) {
btn.parent().removeClass('disabled');
} else {
btn.parent().addClass('disabled');
}
});
});
}
/*
* parse_link_header()
*