timeline updates major ones..

This commit is contained in:
Harry Bomrah 2012-06-26 21:09:33 +08:00
parent 555ec86403
commit 4aa155a44d
10 changed files with 87 additions and 52 deletions

View File

@ -8,61 +8,72 @@ var orbitTimeline = function(dom){
//this.marker = t.timelineHtml.find("#timline_marker");
this.scale = t.timelineHtml.find("#timeline_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.initialize = function(){
t.dom.html(t.timelineHtml);
$("div.scrollbar").hide();
//var cursor = t.marker.draggable({containment:"parent","option":"cursorAt"});
var timelineScale = t.constructTimeScale();
$("#timeline_scale").html(timelineScale);
t.makeBubble("012012");
t.makeBubble("012012");
$("#test_bubble").click(function(){
t.makeBubble("062012");
})
t.constructTimeScale(function(timelineScale){
$("#timeline_scale").html(timelineScale);
for(eve in t.events){
t.makeBubble(t.events[eve]);
}
});
}
this.constructTimeScale = function(){
//$.getJSON("test.json",function(){
var scale = $("<div id='scale_wrapper'></div>");
scale.append($("<div class='scale_region year'>2013</div><div class='scale_region month' data-content='012012'><div class='month_heading'>January</div><div class='bubble_list'></div></div><div class='scale_region month' data-content='062012'><div class='month_heading'>June</div><div class='bubble_list'></div></div><div class='scale_region year'>2012</div>"));
scale.find(".scale_region").each(function(){
var verticalchars = "";
var txt = $(this).text();
var margin = ($(this).width()-20)/2;
// for(c in txt){
// if($(this).hasClass('month')){
// verticalchars+="<span style='padding-left:"+margin+"px'>"+txt.charAt(c)+"</span>";
// }else
// verticalchars+="<span style='padding-left:5px'>"+txt.charAt(c)+"</span>";
// }
//$(this).html(verticalchars);
this.constructTimeScale = function(callbackFn){
var mon ="",year="";
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){
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 bubbleData = {"fulldate" : t.monthList[parseInt(cur_mon)] +", " + dt.getDate() + ", " + cur_year,"title":paper.title,"jtitle":journal.title,"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>"));
}
if(cur_mon != mon){
mon = cur_mon;
scale.append($("<div class='scale_region month' data-content='"+cdt+"'><div class='month_heading'>"+t.monthList[parseInt(mon)]+"</div><div class='bubble_list'></div></div>"))
}
});
})
return scale;
//})
scale.append($("<div class='scale_region year'>"+year+"</div>"));
if(typeof callbackFn == "function"){
callbackFn.call(this,scale);
}
});
}
this.makeBubble = function(timestamp){
var totalul = $("#scale_wrapper").find("div[data-content="+timestamp+"] ul").length;
var targetul = $("#scale_wrapper div[data-content="+timestamp+"] div.bubble_list ul").eq(totalul-1);
this.makeBubble = function(bubbleData){
var totalul = $("#scale_wrapper").find("div[data-content="+bubbleData.timestamp+"] ul").length;
var targetul = $("#scale_wrapper div[data-content="+bubbleData.timestamp+"] div.bubble_list ul").eq(totalul-1);
if(totalul == 0){
var ul = $("<ul></ul>");
$("#scale_wrapper").find("div[data-content="+timestamp+"] div.bubble_list").append(ul);
$("#scale_wrapper").find("div[data-content="+bubbleData.timestamp+"] div.bubble_list").append(ul);
targetul = ul;
}else{
var totalli = targetul.find("li").length;
if(totalli >= 5){
var ul = $("<ul></ul>");
$("#scale_wrapper").find("div[data-content="+timestamp+"] div.bubble_list").append(ul);
$("#scale_wrapper").find("div[data-content="+bubbleData.timestamp+"] div.bubble_list").append(ul);
targetul = ul;
}
}
var bubble = $("<li class='bubble'>This is test bubble.</li>");
var bt = (bubbleData.title.length > 70? bubbleData.title.substr(0,70) + "..." : bubbleData.title);
var bubble = $("<li class='bubble'><span>"+bt+"<span class='date'> - "+bubbleData.fulldate+"</span></span></li>");
bubble.css("margin-left","25px");
targetul.prepend(bubble);
bubble.show("bounce",{},500);
bubble.show();
bubble.click(function(){
o.toolPopup({
parent: $(this),
html : "<div><b><u>"+timestamp+"</u></b></div>",
html : "<div><h3>"+bubbleData.jtitle+"</h3><span><h2>Co-Authors: </h2>"+bubbleData.coauthors+"</span><span><h2>Abstract: </h2>"+bubbleData.abstract+"</span></div>",
height: "auto",
width:"300px"
});

View File

@ -112,9 +112,6 @@ var orbitDesktop = function(dom){
});
$("a#d_appstore").click(function(){
var target = $(this).attr("href");
console.log(o.currenthtml);
console.log(target);
console.log(o.currentface);
if(o.currenthtml!=target){
o.desktopData[o.currentface] = $(o.contentHolder).html();
$("#content").hide("drop",o.transitionTime,function(){
@ -907,7 +904,6 @@ var orbitDesktop = function(dom){
this.initializeOrbitTimeline = function(target){
o.currenthtml = target;
o.currentface = "orbit";
console.log(o.currentface);
var bindHandlers = function(){
var timeline = new orbitTimeline("timeline");
timeline.initialize();

View File

@ -173,7 +173,7 @@ var orbitDesktopAPI = function(){
settings.width = (!settings.width ? "150px" : settings.width);
settings.html = (!settings.html ? "" : settings.html);
var leftpos = settings.parent.width();
var toolpopup = $("<div class='desktop_toolpopup thmc1' style='height:"+settings.height+";width:"+settings.width+"; left:"+leftpos+"px;'><span>"+settings.html+"</span></div>");
var toolpopup = $("<div class='desktop_toolpopup' style='height:"+settings.height+";width:"+settings.width+"; left:"+leftpos+"px;'><span>"+settings.html+"</span></div>");
settings.parent.css("position","relative");
settings.parent.prepend(toolpopup);
toolpopup.click(function(event){

View File

@ -724,6 +724,19 @@ a:focus { outline: none; }
border-radius:5px;
border-color:black;
font-size:15px;
padding: 5px 0px 10px 0px;
padding: 10px;
cursor: default;
background-color:#ccc;
}
.desktop_toolpopup span{
margin:3px 0 3px 0;
}
.desktop_toolpopup h3{
text-align: center;
font-weight:bolder;
margin-bottom:5px;
}
.desktop_toolpopup h2{
font-weight:bolder;
margin-top:3px;
}

View File

@ -1,5 +1,5 @@
.t_scale{
width:2000px;
min-width:2000px;
height:516px;
bottom:0;
}
@ -43,16 +43,15 @@
cursor: pointer;
width:300px;
height:30px;
background:lightblue;
border-style:solid;
border-width:5px;
float: left;
border-radius:5px;
margin-top: 10px;
margin-bottom:10px;
font-size:20px;
font-size:15px;
padding:5px;
text-align:center;
text-align:justify;
display: none;
}
.month_heading{
@ -64,3 +63,7 @@
width:350px;
float:left;
}
.bubble_list ul li span.date{
font-weight:bolder;
float:right;
}

View File

@ -4,4 +4,17 @@ class DesktopOrbitController< ApplicationController
render "desktop/orbit", :layout => false
end
def getevents
@event = params["event"]
@data = Array.new
case @event
when "papers"
@journals = current_user.journals
@journals.each do |journal|
@data << {"title"=> journal.title,"papers"=> journal.papers}
end
end
render :json=>@data.to_json
end
end

View File

@ -12,14 +12,14 @@ class DesktopPublicationsController< ApplicationController
end
def create_journal
Journal.create(user_id: current_user.id, title: "2012, Material Chemistry and Physics Journal")
Journal.create(user_id: current_user.id, title: "2012, Javascript")
b = Array.new
b << {"success"=>"true"}
render :json=>b.to_json
end
def getjournals
@journals = Journal.all
@journals = current_user.journals
data = Array.new
@journals.each do |journal|
@papers = journal.papers.all

View File

@ -11,7 +11,7 @@ class Journal
before_create :initialize_paper
def initialize_paper
for i in 0..25
for i in 0..5
self.papers.build
end
end

View File

@ -16,8 +16,6 @@
</div>
</div>
</div>
<button id="test_bubble" style="z-index:10px; postion:absolute;">Add bubble</button>
</div>
<div class="clear"></div>
</div>

View File

@ -168,7 +168,8 @@ Orbit::Application.routes.draw do
match '/desktop_appstore/widgets_settings'=>'desktop_appstore#widgets_settings'
match '/desktop_orbit/orbit' => 'desktop_orbit#orbit'
match '/desktop_orbit/getevents' => 'desktop_orbit#getevents'
#match '/desktop_orbit/getevents' => 'desktop_publications#create_journal'
match '/desktop/temp_func/'=>'desktop#temp_func'