developers/orbit-basic
2
0 Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Timeline design and timescale update

Browse Source
This commit is contained in:
Harry Bomrah committed 2012-07-06 16:11:03 +08:00
1 parent bfaed4deb4
commit 830eb8eb62
7 files changed
+91 -51
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/assets/javascripts/orbitTimeline.js
+50 -35
View File
@@ -3,7 +3,7 @@
var orbitTimeline = function(dom){
t = this;
this.dom = $("#"+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 = "";
@@ -18,9 +18,9 @@ var orbitTimeline = function(dom){
$("div.scrollbar").hide();
t.constructTimeScale(function(timelineScale){
$("#timeline_scale").html(timelineScale);
var totalyearwidth =timelineScale.find(".year").length * 200;
var totalyearwidth =timelineScale.find(".year").length * timelineScale.find(".year").outerWidth();
var totalul = 0;
$(".t_scale").css({"min-width":$(".tinycanvas .viewport").width()+200 + "px"})
$(".t_scale").css({"min-width":$(".tinycanvas .viewport").width()+500 + "px"})
for(eve in t.events){
t.makeBubble(t.events[eve]);
totalul = $("#scale_wrapper ul").length
@@ -30,7 +30,7 @@ var orbitTimeline = function(dom){
$('.tinycanvas').tinyscrollbar({
axis: 'x',
onMove: function(x){
var limit = $("#timeline_scale").width() - $(".tinycanvas .scrollbar").width();
var limit = $("#timeline_scale").outerWidth() - $(".tinycanvas .scrollbar").outerWidth();
if(t.ajaxload){
if((limit - x) < 10){
t.eventAjaxLoad(function(){
@@ -52,6 +52,16 @@ var orbitTimeline = function(dom){
this.constructTimeScale = function(callbackFn){
var mon ="",year="",formname;
var scale = $("<div id='scale_wrapper'></div>");
$.getJSON("desktop_orbit/gettimelinespan",{"get":"papers"},function(years){
var $ul = $("<ul></ul>");
var startyear = years.startyear, endyear = years.endyear,year = years.startyear;
$ul.append('<li><a href="'+startyear+'" class="wh3 hh3 admbg active" onclick="return false;">'+startyear+'</a></li>');
while(year > endyear){
year--;
$ul.append('<li><a href="'+year+'" class="wh3 hh3 admbg" onclick="return false;">'+year+'</a></li>');
}
$("div#orbit div#year_navigation").html($ul);
})
$.getJSON("desktop_orbit/eventajaxload",{"event":"papers","from":t.fromdate},function(papersArray){
$.each(papersArray,function(i,pa){
$.each(pa.papers,function(i,paper){
@@ -64,7 +74,7 @@ var orbitTimeline = function(dom){
t.events.push(bubbleData);
if(cur_year != year){
year = cur_year;
scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+(year+1)+"</div><div class='region_year group' data-content='"+year+"'></div>"));
scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+year+"</div><div class='region_year group' data-content='"+year+"'></div>"));
}
if(cur_mon != mon){
mon = cur_mon;
@@ -73,7 +83,7 @@ var orbitTimeline = function(dom){
}
});
});
scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+year+"</div><div class='region_year group' data-content='"+(year-1)+"'></div>"));
//scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+year+"</div><div class='region_year group' data-content='"+(year-1)+"'></div>"));
t.fromdate = [year,formname-1];
if(typeof callbackFn == "function"){
callbackFn.call(this,scale);
@@ -101,13 +111,31 @@ var orbitTimeline = function(dom){
targetul.prepend(bubble);
bubble.show();
bubble.click(function(){
var thisbubble = $(this);
$(this).parents(dom)
.find('.bubble, .date')
.removeClass('thmc1 thmtxt');
o.toolPopup({
parent: $(this).parent(),
html : "<div class='bubble_content'><h2>"+bubbleData.jtitle+"</h2><h3>Co-Authors</h3><span class='context'>"+bubbleData.coauthors+"</span><h3>Abstract</h3><span class='context'>"+bubbleData.abstract+"</span></div>",
height: "392px",
width:"310px"
width:"310px",
beforeClose : function(){
$("div.bubble_arrow").remove();
thisbubble.parents(dom)
.find('.bubble, .date')
.removeClass('thmc1 thmtxt');
},
onOpen : function(){
thisbubble.append('<div class="bubble_arrow"/>');
},
beforeOpen : function(){
thisbubble.addClass('thmc1 thmtxt');
thisbubble.find('.date').addClass('thmtxt');
}
});
})//.mouseout(function(){t.oapi.toolPopup("destroy");})
})
}
this.eventAjaxLoad = function(callbackFn){
t.events = [];
@@ -128,7 +156,7 @@ var orbitTimeline = function(dom){
if(cur_year != year){
year = cur_year;
if(scale.find("div[data-content="+year+"]").length == 0){
scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+(year+1)+"</div><div class='region_year group' data-content='"+year+"'></div>"));
scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+year+"</div><div class='region_year group' data-content='"+year+"'></div>"));
}
}
if(cur_mon != mon){
@@ -139,8 +167,8 @@ var orbitTimeline = function(dom){
});
});
if(papersArray.length != 0){
if(scale.find("div[data-content="+(year-1)+"]").length == 0)
scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+year+"</div><div class='region_year group' data-content='"+(year-1)+"'></div>"));
// if(scale.find("div[data-content="+(year-1)+"]").length == 0)
// scale.append($("<div class='group year w1 h1 hp vp thmtxt thmc1'>"+year+"</div><div class='region_year group' data-content='"+(year-1)+"'></div>"));
t.ajaxload = true;
t.fromdate = [year,formname-1];
}
@@ -152,29 +180,16 @@ var orbitTimeline = function(dom){
}
this.bubble_fx = function(){
$('.bubble').on({
mouseover: function(){
$(this)
.addClass('hover')
.append('<span class="icon-chevron-right" />');
},
mouseout: function(){
$(this)
.removeClass('hover')
.find('.icon-chevron-right').remove();
},
click: function(){
$(this)
.parents('#timeline')
.find('.bubble, .date')
.removeClass('thmc1 thmtxt');
$(this)
.addClass('thmc1 thmtxt');
$(this)
.find('.date')
.addClass('thmtxt');
$(this)
.append('<div class="bubble_arrow"/>');
}
});
mouseover: function(){
$(this)
.addClass('hover')
.append('<span class="icon-chevron-right" />');
},
mouseout: function(){
$(this)
.removeClass('hover')
.find('.icon-chevron-right').remove();
},
});
}
}
app/assets/javascripts/orbitdesktop.js
+1 -1
View File
@@ -923,7 +923,7 @@ var orbitDesktop = function(dom){
o.currenthtml = target;
o.currentface = "orbit";
var bindHandlers = function(){
var timeline = new orbitTimeline("timeline");
var timeline = new orbitTimeline("#timeline");
timeline.initialize();
}
if(!o.desktopData[o.currentface]){
app/assets/javascripts/orbitdesktopAPI.js
+12 -2
View File
@@ -163,7 +163,6 @@ var orbitDesktopAPI = function(){
$(".desktop_toolpopup").hide("fold",function(){
$(this).remove();
$(this).parent().css("position","");
})
return;
}
@@ -172,6 +171,14 @@ var orbitDesktopAPI = function(){
settings.height = (!settings.height ? "50px" : settings.height);
settings.width = (!settings.width ? "150px" : settings.width);
settings.html = (!settings.html ? "" : settings.html);
//Events
settings.onClose = (!settings.onClose ? function(){} : settings.onClose);
settings.beforeOpen = (!settings.beforeOpen ? function(){} : settings.beforeOpen);
settings.onOpen = (!settings.onOpen ? function(){} : settings.onOpen);
settings.beforeClose = (!settings.beforeClose ? function(){} : settings.beforeClose);
//Events end
var leftpos = settings.parent.outerWidth();
var toolpopup = $("<div class='desktop_toolpopup' style='height:"+settings.height+";width:"+settings.width+"; left:"+leftpos+"px;'>"+settings.html+"</div>");
settings.parent.css("position","relative");
@@ -179,13 +186,16 @@ var orbitDesktopAPI = function(){
toolpopup.click(function(event){
event.stopPropagation();
});
settings.beforeOpen.call(this);
toolpopup.show("fold",function(){
settings.onOpen.call(this);
$(document).unbind("click");
$(document).one("click",function(e){
settings.beforeClose.call(this);
toolpopup.hide("fold",function(){
toolpopup.remove();
settings.parent.css("position","");
settings.onClose.call(this);
});
})
});