Timeline ajax loading
This commit is contained in:
1 parent
a1e74987dc
commit
bacb1f1e63
8 files changed
+327
-24
No files matched your search
@@ -6,57 +6,77 @@ var orbitTimeline = function(dom){
|
||||
this.dom = $("#"+dom);
|
||||
this.timelineHtml = $("<div class='t_bottom t_scale' id='timeline_scale'></div>");
|
||||
//this.marker = t.timelineHtml.find("#timline_marker");
|
||||
this.scale = t.timelineHtml.find("#timeline_scale");
|
||||
this.scale = "";
|
||||
//this.container = t.timelineHtml.find("#t_container");
|
||||
this.events = new Array;
|
||||
this.monthList = ["","January","February","March","April","May","June","July","August","September","October","November","December"];
|
||||
this.dt = new Date();
|
||||
this.fromdate = [t.dt.getFullYear(),t.dt.getMonth()+1];
|
||||
this.ajaxload = true;
|
||||
this.initialize = function(){
|
||||
t.dom.html(t.timelineHtml);
|
||||
$("div.scrollbar").hide();
|
||||
t.constructTimeScale(function(timelineScale){
|
||||
console.log(timelineScale);
|
||||
$("#timeline_scale").html(timelineScale);
|
||||
var totalyearwidth =timelineScale.find(".year").length * 100;
|
||||
var totalul = 0;
|
||||
$(".t_scale").css({"min-width":$(".tinycanvas .viewport").width()+200 + "px"})
|
||||
for(eve in t.events){
|
||||
t.makeBubble(t.events[eve]);
|
||||
totalul = $("#scale_wrapper ul").length
|
||||
$(".t_scale").width((totalul*350) + totalyearwidth);
|
||||
}
|
||||
|
||||
$('.tinycanvas').tinyscrollbar({ axis: 'x'});
|
||||
$('.tinycanvas').tinyscrollbar({
|
||||
axis: 'x',
|
||||
onMove: function(x){
|
||||
var limit = $("#timeline_scale").width() - $(".tinycanvas .scrollbar").width();
|
||||
if(t.ajaxload){
|
||||
if((limit - x) < 10){
|
||||
t.eventAjaxLoad(function(){
|
||||
var totalul = 0;
|
||||
for(eve in t.events){
|
||||
t.makeBubble(t.events[eve]);
|
||||
totalul = $("#scale_wrapper ul").length
|
||||
$(".t_scale").width((totalul*350) + totalyearwidth);
|
||||
}
|
||||
$('.tinycanvas').tinyscrollbar_update(x);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
this.constructTimeScale = function(callbackFn){
|
||||
var mon ="",year="";
|
||||
var mon ="",year="",formname;
|
||||
var scale = $("<div id='scale_wrapper'></div>");
|
||||
$.getJSON("desktop_orbit/getevents",{"event":"papers"},function(journals){
|
||||
$.each(journals,function(x,journal){
|
||||
$.each(journal.papers,function(i,paper){
|
||||
$.getJSON("desktop_orbit/getevents",{"event":"papers","from":t.fromdate},function(papers){
|
||||
$.each(papers,function(i,paper){
|
||||
var dt = new Date(paper.created_at);
|
||||
var cur_mon = paper.created_at.substr(5,2);
|
||||
var cur_year = dt.getFullYear();
|
||||
var cdt = paper.created_at.substr(0,7).replace("-","");
|
||||
var formname = (cur_mon.charAt(0) == "0"?cur_mon.charAt(1) : cur_mon)
|
||||
var bubbleData = {"fulldate" : t.monthList[parseInt(formname)] +", " + dt.getDate() + ", " + cur_year,"title":paper.title,"jtitle":journal.title,"coauthors":paper.coauthors,"abstract":paper.abstract,"timestamp":cdt}
|
||||
formname = (cur_mon.charAt(0) == "0"?cur_mon.charAt(1) : cur_mon)
|
||||
var bubbleData = {"fulldate" : t.monthList[parseInt(formname)] +", " + dt.getDate() + ", " + cur_year,"title":paper.title,"jtitle":"Harry","coauthors":paper.coauthors,"abstract":paper.abstract,"timestamp":cdt}
|
||||
t.events.push(bubbleData);
|
||||
if(cur_year != year){
|
||||
year = cur_year;
|
||||
scale.append($("<div class='scale_region year'>"+(year+1)+"</div>"));
|
||||
scale.append($("<div class='scale_region year'>"+(year+1)+"</div><div data-content='"+year+"'></div>"));
|
||||
}
|
||||
if(cur_mon != mon){
|
||||
mon = cur_mon;
|
||||
console.log(parseInt(cur_mon));
|
||||
scale.append($("<div class='scale_region month' data-content='"+cdt+"'><div class='month_heading'>"+t.monthList[parseInt(formname)]+"</div><div class='bubble_list'></div></div>"))
|
||||
var yr = scale.find("div[data-content="+year+"]");
|
||||
yr.append($("<div class='scale_region month' data-content='"+cdt+"'><div class='month_heading'>"+t.monthList[parseInt(formname)]+"</div><div class='bubble_list'></div></div>"))
|
||||
}
|
||||
});
|
||||
scale.append($("<div class='scale_region year'>"+year+"</div><div data-content='"+(year-1)+"'></div>"));
|
||||
t.fromdate = [year,formname-1];
|
||||
if(typeof callbackFn == "function"){
|
||||
callbackFn.call(this,scale);
|
||||
}
|
||||
})
|
||||
scale.append($("<div class='scale_region year'>"+year+"</div>"));
|
||||
if(typeof callbackFn == "function"){
|
||||
callbackFn.call(this,scale);
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
this.makeBubble = function(bubbleData){
|
||||
var totalul = $("#scale_wrapper").find("div[data-content="+bubbleData.timestamp+"] ul").length;
|
||||
@@ -87,4 +107,45 @@ var orbitTimeline = function(dom){
|
||||
});
|
||||
})//.mouseout(function(){t.oapi.toolPopup("destroy");})
|
||||
}
|
||||
this.eventAjaxLoad = function(callbackFn){
|
||||
t.events = [];
|
||||
var mon ="",year="",formname;
|
||||
var scale = $("#scale_wrapper");
|
||||
|
||||
t.ajaxload = false;
|
||||
$.getJSON("desktop_orbit/eventajaxload",{"from":t.fromdate},function(papersArray){
|
||||
$.each(papersArray,function(i,pa){
|
||||
$.each(pa.papers,function(i,paper){
|
||||
var dt = new Date(paper.created_at);
|
||||
var cur_mon = paper.created_at.substr(5,2);
|
||||
var cur_year = dt.getFullYear();
|
||||
var cdt = paper.created_at.substr(0,7).replace("-","");
|
||||
formname = (cur_mon.charAt(0) == "0"?cur_mon.charAt(1) : cur_mon)
|
||||
var bubbleData = {"fulldate" : t.monthList[parseInt(formname)] +", " + dt.getDate() + ", " + cur_year,"title":paper.title,"jtitle":"Harry","coauthors":paper.coauthors,"abstract":paper.abstract,"timestamp":cdt}
|
||||
t.events.push(bubbleData);
|
||||
if(cur_year != year){
|
||||
year = cur_year;
|
||||
if(scale.find("div[data-content="+year+"]").length == 0){
|
||||
scale.append($("<div class='scale_region year'>"+(year+1)+"</div><div data-content='"+year+"'></div>"));
|
||||
}
|
||||
}
|
||||
if(cur_mon != mon){
|
||||
mon = cur_mon;
|
||||
var yr = scale.find("div[data-content="+year+"]");
|
||||
yr.append($("<div class='scale_region month' data-content='"+cdt+"'><div class='month_heading'>"+t.monthList[parseInt(formname)]+"</div><div class='bubble_list'></div></div>"))
|
||||
}
|
||||
});
|
||||
});
|
||||
if(papersArray.length != 0){
|
||||
scale.append($("<div class='scale_region year'>"+year+"</div><div data-content='"+(year-1)+"'></div>"));
|
||||
t.ajaxload = true;
|
||||
console.log(year);
|
||||
t.fromdate = [year,formname-1];
|
||||
}
|
||||
if(typeof callbackFn == "function"){
|
||||
callbackFn.call(this,scale);
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user