Commit 78386b9daa7ed371751050adfd82bdf1643d72ec

Authored by Sergio Oliveira
1 parent c443db84

Fixing home chart

Fixing home chart and making sure it works on mobile devices
src/colab/deprecated/templates/base.html
@@ -6,12 +6,11 @@ @@ -6,12 +6,11 @@
6 6
7 <link rel="stylesheet" href="{{ STATIC_URL }}third-party/bootstrap/css/bootstrap.css" type="text/css" media="screen, projection" /> 7 <link rel="stylesheet" href="{{ STATIC_URL }}third-party/bootstrap/css/bootstrap.css" type="text/css" media="screen, projection" />
8 8
9 - <link rel="stylesheet" href="{{ STATIC_URL }}third-party/bootstrap/css/bootstrap-glyphicons.css" type="text/css" media="screen, projection" />  
10 -  
11 <link rel="stylesheet" href="{{ STATIC_URL }}css/screen.css" 9 <link rel="stylesheet" href="{{ STATIC_URL }}css/screen.css"
12 type="text/css" media="screen" charset="utf-8"/> 10 type="text/css" media="screen" charset="utf-8"/>
13 11
14 <script type="text/javascript" src="{{ STATIC_URL }}third-party/jquery-2.0.3.min.js"></script> 12 <script type="text/javascript" src="{{ STATIC_URL }}third-party/jquery-2.0.3.min.js"></script>
  13 + <script type="text/javascript" src="{{ STATIC_URL }}third-party/jquery.debouncedresize.js"></script>
15 <script src="{{ STATIC_URL }}third-party/bootstrap/js/bootstrap.js"></script> 14 <script src="{{ STATIC_URL }}third-party/bootstrap/js/bootstrap.js"></script>
16 15
17 <script type="text/javascript" src="{{ STATIC_URL }}js/base.js"></script> 16 <script type="text/javascript" src="{{ STATIC_URL }}js/base.js"></script>
src/colab/deprecated/templates/home.html
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 {% load i18n %} 2 {% load i18n %}
3 3
4 {% block head_js %} 4 {% block head_js %}
5 - {% include "pizza-chart.html" with chart_div="collabs" chart_width=410 chart_height=330 %} 5 + {% include "pizza-chart.html" with chart_div="collabs" chart_width="100%" chart_height=330 %}
6 {% endblock %} 6 {% endblock %}
7 7
8 {% block header %} 8 {% block header %}
@@ -40,19 +40,19 @@ @@ -40,19 +40,19 @@
40 40
41 41
42 <div class="col-lg-6 col-md-6"> 42 <div class="col-lg-6 col-md-6">
43 - <h3 class="column-align">{% trans "Distribution of Collaborations" %}</h3>  
44 - <div>&nbsp;</div> 43 + <h3 class="column-align">{% trans "Collaboration Graph" %}</h3>
  44 + <div id="collabs"></div>
45 </div> 45 </div>
46 </div> 46 </div>
47 47
48 <div class="row"> 48 <div class="row">
49 <div class="col-lg-6 col-md-6"> 49 <div class="col-lg-6 col-md-6">
50 <h3 class="column-align"> 50 <h3 class="column-align">
51 - {% trans "Most Relevant Discussions" %} 51 + {% trans "Most Relevant Threads" %}
52 </h3> 52 </h3>
53 <a class="rss-icon" target="_blank" 53 <a class="rss-icon" target="_blank"
54 href="{% url 'rss_hottest_threads' %}" 54 href="{% url 'rss_hottest_threads' %}"
55 - title="{% trans "RSS - Discussions Most Relevance" %}"> 55 + title="{% trans "RSS - Most Relevant Threads" %}">
56 </a> 56 </a>
57 <ul class="message-list"> 57 <ul class="message-list">
58 {% for thread in hottest_threads %} 58 {% for thread in hottest_threads %}
@@ -61,18 +61,18 @@ @@ -61,18 +61,18 @@
61 </ul> 61 </ul>
62 <a class="column-align" 62 <a class="column-align"
63 href="{% url 'thread_list' %}?order=hottest"> 63 href="{% url 'thread_list' %}?order=hottest">
64 - {% trans "View more discussions relevance..." %} 64 + {% trans "View more discussions..." %}
65 </a> 65 </a>
66 <div>&nbsp;</div> 66 <div>&nbsp;</div>
67 </div> 67 </div>
68 68
69 <div class="col-lg-6 col-md-6"> 69 <div class="col-lg-6 col-md-6">
70 <h3 class="column-align"> 70 <h3 class="column-align">
71 - {% trans "Latest Discussions" %} 71 + {% trans "Latest Threads" %}
72 </h3> 72 </h3>
73 <a class="rss-icon" target="_blank" 73 <a class="rss-icon" target="_blank"
74 href="{% url 'rss_latest_threads' %}" 74 href="{% url 'rss_latest_threads' %}"
75 - title="{% trans "RSS - Latest Discussions" %}"> 75 + title="{% trans "RSS - Latest Threads" %}">
76 </a> 76 </a>
77 <ul class="message-list"> 77 <ul class="message-list">
78 {% for thread in latest_threads %} 78 {% for thread in latest_threads %}
src/colab/deprecated/templates/pizza-chart.html
@@ -28,8 +28,8 @@ @@ -28,8 +28,8 @@
28 ]); 28 ]);
29 29
30 // Set chart options 30 // Set chart options
31 - var options = {'width': {{ chart_width }},  
32 - 'height': {{ chart_height }}, 31 + var options = {'width': '{{ chart_width }}',
  32 + 'height': '{{ chart_height }}',
33 'legend': 'bottom', 33 'legend': 'bottom',
34 chartArea: { 34 chartArea: {
35 top:10, 35 top:10,
@@ -40,6 +40,10 @@ @@ -40,6 +40,10 @@
40 // Instantiate and draw our chart, passing in some options. 40 // Instantiate and draw our chart, passing in some options.
41 var chart = new google.visualization.PieChart(document.getElementById('{{ chart_div }}')); 41 var chart = new google.visualization.PieChart(document.getElementById('{{ chart_div }}'));
42 chart.draw(data, options); 42 chart.draw(data, options);
  43 +
  44 + $(window).on("debouncedresize", function( event ) {
  45 + chart.draw(data, options);
  46 + });
43 } 47 }
44 </script> 48 </script>
45 {% endif %} 49 {% endif %}
src/colab/static/css/screen.css
@@ -4,14 +4,9 @@ body { @@ -4,14 +4,9 @@ body {
4 padding-top: 70px; 4 padding-top: 70px;
5 } 5 }
6 6
7 -/* better fit for xm and sm screens */  
8 -h3 {  
9 - font-size: 160%;  
10 -}  
11 7
12 /* Header */ 8 /* Header */
13 9
14 -  
15 #header-searchbox { 10 #header-searchbox {
16 width: 140px; 11 width: 140px;
17 } 12 }
src/colab/static/third-party/jquery.debouncedresize.js 0 → 100644
@@ -0,0 +1,47 @@ @@ -0,0 +1,47 @@
  1 +/*
  2 + * debouncedresize: special jQuery event that happens once after a window resize
  3 + *
  4 + * latest version and complete README available on Github:
  5 + * https://github.com/louisremi/jquery-smartresize
  6 + *
  7 + * Copyright 2012 @louis_remi
  8 + * Licensed under the MIT license.
  9 + *
  10 + * This saved you an hour of work?
  11 + * Send me music http://www.amazon.co.uk/wishlist/HNTU0468LQON
  12 + */
  13 +(function($) {
  14 +
  15 +var $event = $.event,
  16 + $special,
  17 + resizeTimeout;
  18 +
  19 +$special = $event.special.debouncedresize = {
  20 + setup: function() {
  21 + $( this ).on( "resize", $special.handler );
  22 + },
  23 + teardown: function() {
  24 + $( this ).off( "resize", $special.handler );
  25 + },
  26 + handler: function( event, execAsap ) {
  27 + // Save the context
  28 + var context = this,
  29 + args = arguments,
  30 + dispatch = function() {
  31 + // set correct event type
  32 + event.type = "debouncedresize";
  33 + $event.dispatch.apply( context, args );
  34 + };
  35 +
  36 + if ( resizeTimeout ) {
  37 + clearTimeout( resizeTimeout );
  38 + }
  39 +
  40 + execAsap ?
  41 + dispatch() :
  42 + resizeTimeout = setTimeout( dispatch, $special.threshold );
  43 + },
  44 + threshold: 150
  45 +};
  46 +
  47 +})(jQuery);
0 \ No newline at end of file 48 \ No newline at end of file