Many things in a single commit. Bad :( !. re #73

* Add partial update. No improvement for now
 * Add some logging to console if DEBUG is enabled.
 * Change the way the sorting box is enabled to help with partial update.
This commit is contained in:
Sébastien Lucas 2013-06-20 14:34:10 +02:00
parent 51c9c416d4
commit 1c8ddb44d4
2 changed files with 38 additions and 7 deletions

View file

@ -22,8 +22,7 @@
</div> </div>
</form> </form>
</div> </div>
{{? it.containsBook == 1}} <div id="sortForm" style="float: right; width: 35%; display: none">
<div style="float: right; width: 35%">
<div style="float: right"> <div style="float: right">
<img id="sort" src="images/sort32.png?v={{=it.const.version}}" alt="{{=it.const.i18n.sortAlt}}" /> <img id="sort" src="images/sort32.png?v={{=it.const.version}}" alt="{{=it.const.i18n.sortAlt}}" />
</div> </div>
@ -40,6 +39,5 @@
</select> </select>
</div> </div>
</div> </div>
{{?}}
</div> </div>
</header> </header>

41
util.js
View file

@ -1,7 +1,19 @@
var templatePage, templateBookDetail, templateMain, currentData; var templatePage, templateBookDetail, templateMain, currentData, before;
var DEBUG = true;
var isEink = /Kobo|Kindle|EBRD1101/i.test(navigator.userAgent); var isEink = /Kobo|Kindle|EBRD1101/i.test(navigator.userAgent);
function debug_log(text) {
if ( DEBUG ) {
console.log(text);
}
}
function elapsed () {
var elapsed = new Date () - before;
return "Elapsed : " + elapsed;
}
function fancyBoxObject (title, type) { function fancyBoxObject (title, type) {
var out = { prevEffect : 'none', nextEffect : 'none' }; var out = { prevEffect : 'none', nextEffect : 'none' };
if (isEink) { if (isEink) {
@ -42,6 +54,7 @@ function htmlEscape(str) {
} }
function navigateTo (url) { function navigateTo (url) {
before = new Date ();
var jsonurl = url.replace ("index", "getJSON"); var jsonurl = url.replace ("index", "getJSON");
$.getJSON(jsonurl, function(data) { $.getJSON(jsonurl, function(data) {
history.pushState(data, "", url); history.pushState(data, "", url);
@ -50,13 +63,30 @@ function navigateTo (url) {
} }
function updatePage (data) { function updatePage (data) {
var result;
data ["const"] = currentData ["const"]; data ["const"] = currentData ["const"];
currentData = data; if (false && $("section").length && currentData.isPaginated == 0 && data.isPaginated == 0) {
var result = templatePage (data); // Partial update (for now disabled)
document.title = data.title; debug_log ("Partial update");
result = templateMain (data);
$("h1").html (data.title);
$("section").html (result);
} else {
// Full update
result = templatePage (data);
$("body").html (result); $("body").html (result);
}
document.title = data.title;
currentData = data;
debug_log (elapsed ());
if ($.cookie('toolbar') == 1) $("#tool").show (); if ($.cookie('toolbar') == 1) $("#tool").show ();
if (currentData.containsBook == 1) {
$("#sortForm").show ();
} else {
$("#sortForm").hide ();
}
ajaxifyLinks (); ajaxifyLinks ();
@ -84,6 +114,7 @@ function updatePage (data) {
if (getCurrentOption ("use_fancyapps") == 1) { if (getCurrentOption ("use_fancyapps") == 1) {
$(".fancydetail").click(function(event){ $(".fancydetail").click(function(event){
event.preventDefault(); event.preventDefault();
before = new Date ();
var url = $(this).attr("href"); var url = $(this).attr("href");
var jsonurl = url.replace ("index", "getJSON"); var jsonurl = url.replace ("index", "getJSON");
$.getJSON(jsonurl, function(data) { $.getJSON(jsonurl, function(data) {
@ -92,6 +123,7 @@ function updatePage (data) {
var fancyparams = fancyBoxObject (data.title, null); var fancyparams = fancyBoxObject (data.title, null);
fancyparams ["content"] = detail; fancyparams ["content"] = detail;
$.fancybox(fancyparams); $.fancybox(fancyparams);
debug_log (elapsed ());
}); });
}); });
@ -123,6 +155,7 @@ function ajaxifyLinks () {
} }
window.onpopstate = function(event) { window.onpopstate = function(event) {
before = new Date ();
updatePage (event.state); updatePage (event.state);
}; };