From 830eb8eb6289615391ebda10195ae78a80190c04 Mon Sep 17 00:00:00 2001 From: Harry Bomrah Date: Fri, 6 Jul 2012 16:11:03 +0800 Subject: [PATCH] Timeline design and timescale update --- Gemfile.lock | 15 ++++ app/assets/javascripts/orbitTimeline.js | 85 ++++++++++++--------- app/assets/javascripts/orbitdesktop.js | 2 +- app/assets/javascripts/orbitdesktopAPI.js | 14 +++- app/controllers/desktop_orbit_controller.rb | 17 +++-- app/views/desktop/orbit.html.erb | 7 +- config/routes.rb | 2 +- 7 files changed, 91 insertions(+), 51 deletions(-) diff --git a/Gemfile.lock b/Gemfile.lock index 65c9dbe8..afec15c8 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,3 +1,18 @@ +GIT + remote: git://github.com/amatsuda/kaminari.git + revision: 82a38e07db1ca1598c8daf073a8f6be22ae714d6 + specs: + kaminari (0.13.0) + actionpack (>= 3.0.0) + activesupport (>= 3.0.0) + +PATH + remote: vendor/impressionist + specs: + impressionist (1.1.1) + httpclient (~> 2.2) + nokogiri (~> 1.5) + GEM remote: http://rubygems.org/ specs: diff --git a/app/assets/javascripts/orbitTimeline.js b/app/assets/javascripts/orbitTimeline.js index 7a11583f..85811cc8 100644 --- a/app/assets/javascripts/orbitTimeline.js +++ b/app/assets/javascripts/orbitTimeline.js @@ -3,7 +3,7 @@ var orbitTimeline = function(dom){ t = this; - this.dom = $("#"+dom); + this.dom = $(dom); this.timelineHtml = $("
"); //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 = $("
"); + $.getJSON("desktop_orbit/gettimelinespan",{"get":"papers"},function(years){ + var $ul = $(""); + var startyear = years.startyear, endyear = years.endyear,year = years.startyear; + $ul.append('
  • '+startyear+'
    • '); + while(year > endyear){ + year--; + $ul.append('
  • '+year+'
    • '); + } + $("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($("
    "+(year+1)+"
    ")); + scale.append($("
    "+year+"
    ")); } if(cur_mon != mon){ mon = cur_mon; @@ -73,7 +83,7 @@ var orbitTimeline = function(dom){ } }); }); - scale.append($("
    "+year+"
    ")); + //scale.append($("
    "+year+"
    ")); 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 : "

    "+bubbleData.jtitle+"

    Co-Authors

    "+bubbleData.coauthors+"

    Abstract

    "+bubbleData.abstract+"
    ", 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('
    '); + }, + 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($("
    "+(year+1)+"
    ")); + scale.append($("
    "+year+"
    ")); } } 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($("
    "+year+"
    ")); + // if(scale.find("div[data-content="+(year-1)+"]").length == 0) + // scale.append($("
    "+year+"
    ")); 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(''); - }, - 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('
    '); - } - }); + mouseover: function(){ + $(this) + .addClass('hover') + .append(''); + }, + mouseout: function(){ + $(this) + .removeClass('hover') + .find('.icon-chevron-right').remove(); + }, + }); } } \ No newline at end of file diff --git a/app/assets/javascripts/orbitdesktop.js b/app/assets/javascripts/orbitdesktop.js index 0d809f5e..1ed112fd 100755 --- a/app/assets/javascripts/orbitdesktop.js +++ b/app/assets/javascripts/orbitdesktop.js @@ -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]){ diff --git a/app/assets/javascripts/orbitdesktopAPI.js b/app/assets/javascripts/orbitdesktopAPI.js index ba38b62e..57065c4d 100644 --- a/app/assets/javascripts/orbitdesktopAPI.js +++ b/app/assets/javascripts/orbitdesktopAPI.js @@ -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 = $("
    "+settings.html+"
    "); 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); }); }) }); diff --git a/app/controllers/desktop_orbit_controller.rb b/app/controllers/desktop_orbit_controller.rb index 29761bfb..4541868e 100644 --- a/app/controllers/desktop_orbit_controller.rb +++ b/app/controllers/desktop_orbit_controller.rb @@ -4,15 +4,16 @@ class DesktopOrbitController< ApplicationController render "desktop/orbit", :layout => false end - def getevents - @event = params["event"] - @data = Array.new - @fromdate = params["from"] - case @event - when "papers" - @data = current_user.papers.where(:created_at.gt => Date.new(Integer(@fromdate[0]),Integer(@fromdate[1])-1),:created_at.lt => Date.new(Integer(@fromdate[0]),Integer(@fromdate[1])+1)).desc(:created_at) + def gettimelinespan + @get = params['get'] + case @get + when "papers" + firstpaper = current_user.papers.all.first + lastpaper = current_user.papers.all.desc(:created_at).last + endyear = Integer(lastpaper.created_at.strftime("%Y")) + startyear = Integer(firstpaper.created_at.strftime("%Y")) end - render :json=>@data.to_json + render :json=>{"startyear"=>startyear,"endyear"=>endyear}.to_json end def eventajaxload diff --git a/app/views/desktop/orbit.html.erb b/app/views/desktop/orbit.html.erb index c73d7526..b9bcbda6 100644 --- a/app/views/desktop/orbit.html.erb +++ b/app/views/desktop/orbit.html.erb @@ -27,16 +27,16 @@
    -
    +
    @@ -44,7 +44,6 @@
    -
    diff --git a/config/routes.rb b/config/routes.rb index 0036d813..60e8a205 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -205,7 +205,7 @@ Orbit::Application.routes.draw do match '/desktop_orbit/orbit' => 'desktop_orbit#orbit' match '/desktop_orbit/eventajaxload'=> 'desktop_orbit#eventajaxload' - match '/desktop_orbit/getevents' => 'desktop_orbit#getevents' + match '/desktop_orbit/gettimelinespan' => 'desktop_orbit#gettimelinespan' #match '/desktop_orbit/eventajaxload' => 'desktop_publications#create_journal' #match '/desktop_orbit/eventajaxload' => 'desktop_publications#delete_journal'