Commit a719bfc9313545bbba5ae2479790b8902d98bb3e
1 parent
bcfdacf0
Exists in
master
and in
4 other branches
Graph: navigation with keyboard
Showing
4 changed files
with
43 additions
and
18 deletions
Show diff stats
app/assets/stylesheets/common.scss
@@ -413,18 +413,6 @@ a.project-update.titled { | @@ -413,18 +413,6 @@ a.project-update.titled { | ||
413 | top:0; | 413 | top:0; |
414 | } | 414 | } |
415 | } | 415 | } |
416 | -/** | ||
417 | - * Project graph | ||
418 | - */ | ||
419 | -#holder { | ||
420 | - cursor: move; | ||
421 | - height: 70%; | ||
422 | - overflow: hidden; | ||
423 | - background:white; | ||
424 | - border: 1px solid $style_color; | ||
425 | -} | ||
426 | - | ||
427 | - | ||
428 | 416 | ||
429 | input.git_clone_url { | 417 | input.git_clone_url { |
430 | width:325px; | 418 | width:325px; |
@@ -889,3 +877,27 @@ li.note { | @@ -889,3 +877,27 @@ li.note { | ||
889 | @extend .primary; | 877 | @extend .primary; |
890 | } | 878 | } |
891 | } | 879 | } |
880 | + | ||
881 | +.graph_holder { | ||
882 | + border: 1px solid #aaa; | ||
883 | + padding:1px; | ||
884 | + | ||
885 | + | ||
886 | + h4 { | ||
887 | + padding:0 10px; | ||
888 | + border-bottom: 1px solid #bbb; | ||
889 | + background:#eee; | ||
890 | + background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #eee), to(#dfdfdf)); | ||
891 | + background-image: -webkit-linear-gradient(#eee 6.6%, #dfdfdf); | ||
892 | + background-image: -moz-linear-gradient(#eee 6.6%, #dfdfdf); | ||
893 | + background-image: -o-linear-gradient(#eee 6.6%, #dfdfdf); | ||
894 | + } | ||
895 | + | ||
896 | + .graph { | ||
897 | + background: #f1f1f1; | ||
898 | + cursor: move; | ||
899 | + height: 70%; | ||
900 | + overflow: hidden; | ||
901 | + } | ||
902 | + | ||
903 | +} |
app/views/projects/graph.html.haml
1 | -%h3 Network Graph | 1 | +%h3 Project Network Graph |
2 | %br | 2 | %br |
3 | -#holder.graph | 3 | +.graph_holder |
4 | + %h4 | ||
5 | + %small You can move around the graph by using arrow keys. | ||
6 | + #holder.graph | ||
4 | :javascript | 7 | :javascript |
5 | var chunk1={commits:#{@commits_json}}; | 8 | var chunk1={commits:#{@commits_json}}; |
6 | var days=#{@days_json}; | 9 | var days=#{@days_json}; |
7 | initGraph(); | 10 | initGraph(); |
8 | $(function(){ | 11 | $(function(){ |
9 | branchGraph($("#holder")[0]); | 12 | branchGraph($("#holder")[0]); |
13 | + initGraphNav(); | ||
10 | }); | 14 | }); |
vendor/assets/javascripts/branch-graph.js
@@ -37,17 +37,17 @@ function branchGraph(holder) { | @@ -37,17 +37,17 @@ function branchGraph(holder) { | ||
37 | r = Raphael("holder", cw, ch), | 37 | r = Raphael("holder", cw, ch), |
38 | top = r.set(); | 38 | top = r.set(); |
39 | var cuday = 0, cumonth = ""; | 39 | var cuday = 0, cumonth = ""; |
40 | - r.rect(0, 0, days.length * 20 + 80, 30).attr({fill: "#FFF"}); | ||
41 | - r.rect(0, 30, days.length * 20 + 80, 20).attr({fill: "#f1f1f1"}); | 40 | + r.rect(0, 0, days.length * 20 + 80, 30).attr({fill: "#222"}); |
41 | + r.rect(0, 30, days.length * 20 + 80, 20).attr({fill: "#444"}); | ||
42 | 42 | ||
43 | for (mm = 0; mm < days.length; mm++) { | 43 | for (mm = 0; mm < days.length; mm++) { |
44 | if(days[mm] != null){ | 44 | if(days[mm] != null){ |
45 | if(cuday != days[mm][0]){ | 45 | if(cuday != days[mm][0]){ |
46 | - r.text(10 + mm * 20, 40, days[mm][0]).attr({font: "14px Fontin-Sans, Arial", fill: "#444"}); | 46 | + r.text(10 + mm * 20, 40, days[mm][0]).attr({font: "14px Fontin-Sans, Arial", fill: "#DDD"}); |
47 | cuday = days[mm][0] | 47 | cuday = days[mm][0] |
48 | } | 48 | } |
49 | if(cumonth != days[mm][1]){ | 49 | if(cumonth != days[mm][1]){ |
50 | - r.text(10 + mm * 20, 15, days[mm][1]).attr({font: "14px Fontin-Sans, Arial", fill: "#474D57"}); | 50 | + r.text(10 + mm * 20, 15, days[mm][1]).attr({font: "14px Fontin-Sans, Arial", fill: "#EEE"}); |
51 | cumonth = days[mm][1] | 51 | cumonth = days[mm][1] |
52 | } | 52 | } |
53 | 53 |