saurabh
/
orbit-basic
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

timeline and font update

This commit is contained in:
devin 2012-07-02 16:22:51 +08:00
parent 6533abf214
commit 08fd07b6aa
6 changed files with 69 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
app/assets/javascripts/orbitTimeline.js
View File

@ -29,7 +29,7 @@ var orbitTimeline = function(dom){
}
this.constructTimeScale = function(callbackFn){
var mon ="",year="";
var scale = $("<div id='scale_wrapper'></div>");
var scale = $("<div id='scale_wrapper' class='ph'></div>");
$.getJSON("desktop_orbit/getevents",{"event":"papers"},function(journals){
$.each(journals,function(x,journal){
$.each(journal.papers,function(i,paper){
@ -42,16 +42,16 @@ var orbitTimeline = function(dom){
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='group year w1 h1 thmtxt thmc1'>"+(year+1)+"</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>"))
scale.append($("<div class='group month' data-content='"+cdt+"'><div class='month_heading hp vp'>"+t.monthList[parseInt(formname)]+"</div><div class='bubble_list'></div></div>"))
}
});
})
scale.append($("<div class='scale_region year'>"+year+"</div>"));
scale.append($("<div class='group year w1 h1 thmtxt thmc1'>"+year+"</div>"));
if(typeof callbackFn == "function"){
callbackFn.call(this,scale);
}
@ -75,7 +75,6 @@ var orbitTimeline = function(dom){
}
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();
bubble.click(function(){

12
app/assets/javascripts/orbitdesktop.js
View File

@ -1000,8 +1000,8 @@ var orbitDesktop = function(dom){
var bindSecondaryHandlers = function(){
$("#journal_p div#paper_list a").click(function(){
if($(this).hasClass("item_check_status")){
$(this).toggleClass("checked");
if($(this).hasClass("icon-check-empty")){
$(this).switchClass("icon-check-empty","icon-check");
}else if($(this).hasClass("icon-star")){
$(this).removeClass("icon-star").addClass("icon-star-empty");
}else if($(this).hasClass("icon-star-empty")){
@ -1018,7 +1018,7 @@ var orbitDesktop = function(dom){
li;
$.each(journalData,function(i,journal){
$.each(journal.papers,function(j,paper){
li = $('<li class="list_t_item"><div class="list_item_action"><a href="" class="item_check_status"><span class="icon-ok"></span></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+journal.title+'</div><div class="list_t_des">'+paper.title+'</div></li>');
li = $('<li class="list_t_item"><div class="list_item_action"><a href="" class="icon-check-empty"></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+journal.title+'</div><div class="list_t_des">'+paper.title+'</div></li>');
column.find("ul").append(li);
if(counter%5==0){
$("#journal_p div#paper_list div.overview").append(column);
@ -1038,7 +1038,7 @@ var orbitDesktop = function(dom){
li;
$.each(journalData,function(i,journal){
$.each(journal.papers,function(j,paper){
li = $('<li class="list_t_item"><div class="list_item_action"><a href="" class="item_check_status"><span class="icon-ok"></span></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+paper.title+'</div><div class="list_t_des">'+paper.keywords+'</div></li>');
li = $('<li class="list_t_item"><div class="list_item_action"><a href="" class="icon-check-empty"></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+paper.title+'</div><div class="list_t_des">'+paper.keywords+'</div></li>');
column.find("ul").append(li);
if(counter%5==0){
$("#journal_p div#paper_list div.overview").append(column);
@ -1058,7 +1058,7 @@ var orbitDesktop = function(dom){
li;
$.each(journalData,function(i,journal){
$.each(journal.papers,function(j,paper){
li = $('<li class="list_t_item"><div class="list_item_action"><a href="" class="item_check_status"><span class="icon-ok"></span></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+paper.title+'</div></li>');
li = $('<li class="list_t_item"><div class="list_item_action"><a href="" class="icon-check-empty"></a></span></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+paper.title+'</div></li>');
column.find("ul").append(li);
if(counter%5==0){
$("#journal_p div#paper_list div.overview").append(column);
@ -1077,7 +1077,7 @@ var orbitDesktop = function(dom){
li;
$.each(journalData,function(i,journal){
$.each(journal.papers,function(j,paper){
li = $('<li class="list_t_item" style="height:auto;"><div class="list_item_action"><a href="" class="item_check_status"><span class="icon-ok"></span></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+paper.title+'</div><div class="list_t_des">'+paper.abstract+paper.abstract+'</div></li>');
li = $('<li class="list_t_item" style="height:auto;"><div class="list_item_action"><a href="" class="icon-check-empty"></a><a href="" class="icon-star-empty"></a></div><div class="list_t_title">'+paper.title+'</div><div class="list_t_des">'+paper.abstract+paper.abstract+'</div></li>');
column.find("ul").append(li);
$("#journal_p div#paper_list div.overview").append(column);
column = $('<div class="g_col list_t"><ul></ul></div>');

37
app/assets/stylesheets/desktopmain.css
View File

@ -251,6 +251,15 @@ a:focus { outline: none; }
.sdm_o a { display: block; }
.sdm_o .admtxt { display: block; line-height: 36px; }
/* with indicator */
.sdm_mdr .sdm_t {
padding-right: 12px;
}
.sdm_mdr .mdr {
position: absolute;
right: 0;
}
/* simple menu */
.s_menu { font-size: 15px; line-height: 36px; }
.s_menu li { border-top: solid 1px #ddd; }
@ -268,6 +277,8 @@ a:focus { outline: none; }
.st_c { display: none; }
.st_c:first-child { display: block; }
/* header drop menu */
.sdm_mdr .sdm_o { top: 36px; }
/* tool bar */
.toolbar {
@ -668,15 +679,15 @@ a:focus { outline: none; }
}
.list_item_action a {
display: block;
width: 15px;
height: 15px;
line-height: 15px;
width: 20px;
height: 20px;
line-height: 20px;
margin: 1px 1px 6px 1px;
}
.list_item_action .icon-ok { visibility: hidden; }
.list_item_action .item_check_status { outline: solid 1px #999; }
.list_item_action .icon-star-empty { color: #999; font-size: 20px; }
.list_item_action .icon-star { color: #faa732; font-size: 20px; }
.list_item_action .icon-check-empty { color: #999; font-size: 20px; }
.list_item_action .icon-check { color: #333; font-size: 20px; }
.item_check_status:hover .icon-ok, .item_check_status.checked .icon-ok { visibility: visible; }
/* Journal Paper Add */
@ -715,15 +726,17 @@ a:focus { outline: none; }
font-size: 20px;
cursor: pointer;
}
/* Timeline */
#orbit .holder .admbg {
background-color: #efefef;
}
/*Tooltip popup */
.desktop_toolpopup {
position: absolute;
z-index: 10px;
display: none;
border-width: 3px;
border-radius: 5px;
border-color: black;
font-size: 15px;
padding: 10px;
cursor: default;
background-color: #ccc;
@ -732,11 +745,7 @@ a:focus { outline: none; }
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;
}

48
app/assets/stylesheets/orbitTimeline.css
View File

@ -1,7 +1,8 @@
.t_scale{
min-width:2000px;
height:516px;
bottom:0;
height: 516px;
}
#scale_wrapper {
overflow: hidden;
}
#timline_marker{
width:100px;
@ -12,58 +13,35 @@
border-width:5px;
border-radius:5px;
}
.t_scale{
border-style:solid;
border-width:2px;
border-radius:5px;
}
#t_container{
height:366px;
}
.scale_region{
height:516px;
border-style:solid;
border-width:0 2px 0 2px;
float: left;
margin-right:1px;
font-size:20px;
padding:5px;
.scale_region {
}
.scale_region span{
display: block;
.group {
margin-right: 48px;
}
.month{
}
.year{
background-color: #c0bebe;
width:30px;
}
.bubble{
cursor: pointer;
width:300px;
height:30px;
border-style:solid;
border-width:5px;
float: left;
border-radius:5px;
margin-top: 10px;
margin-bottom:10px;
font-size:15px;
padding:5px;
text-align:justify;
display: none;
}
.month_heading{
text-align: center;
margin-bottom: 10px;
color: #333;
font-family: 'Open sans', sans-serif;
font-size: 21px;
background-color: #efefef;
}
.bubble_list ul{
width:350px;
float:left;
}
.bubble_list ul li span.date{
font-weight:bolder;
float:right;
width: 300px;
height: 440px;
}

2
app/assets/stylesheets/style.css.erb
View File

@ -1,4 +1,4 @@
@import url(http://fonts.googleapis.com/css?family=Cuprum);
@import url(http://fonts.googleapis.com/css?family=Cuprum|Open+Sans:400,300);
@font-face{
font-family: 'WebSymbolsRegular';
src: url(<%= asset_path 'websymbols-regular-webfont.eot' %>);

23
app/views/desktop/orbit.html.erb
View File

@ -4,9 +4,30 @@
<div class="dtitle w2 hh3 hp">
<span class="thmtxth">TimeLine</span>
</div>
<div class="w1 hh2 hp sdm sdm_mdr hfn">
<span class="tile thmc2"></span>
<div class="sdm_t hh2 thmtxt">following<span class="icon-chevron-down mdr"></span></div>
<div class="admbg sdm_o">
<ul>
<li><a class="w1 hp hh2 admtxt" href="">suggestion</a></li>
<li><a class="w1 hp hh2 admtxt" href="">popular</a></li>
</ul>
</div>
</div>
<div class="w1 hh2 hp sdm sdm_mdr hfn">
<span class="tile thmc2"></span>
<div class="sdm_t hh2 thmtxt">publication<span class="icon-chevron-down mdr"></span></div>
<div class="admbg sdm_o">
<ul>
<li><a class="w1 hp hh2 admtxt" href="">photos</a></li>
<li><a class="w1 hp hh2 admtxt" href="">papers</a></li>
<li><a class="w1 hp hh2 admtxt" href="">books</a></li>
</ul>
</div>
</div>
</div>
<div id="holder">
<div id="panel_r" class="ph pw admbg hp" style="margin-left:0px; padding:0px;">
<div id="" class="ph admbg">
<div class="tinycanvas">
<div class="scrollbar sb_h vp"><div class="track"><div class="thumb thmc2"><div class="end"></div></div></div></div>
<div class="viewport">