Updates callout style.

diff --git a/data/graphs/test.json b/data/graphs/test.json
index 560e988..3d00020 100644 (file)
--- a/data/graphs/test.json
+++ b/data/graphs/test.json
@@ -1,110 +1,110 @@
 {
     "options": {
-        "animatedZooms": true, 
-        "avoidMinZero": false, 
-        "axis": null, 
-        "axisLabelColor": "#666666", 
-        "axisLabelFontSize": 11, 
-        "axisLabelFormatter": null, 
-        "axisLabelWidth": 50, 
-        "axisLineColor": "#AAAAAA", 
-        "axisLineWidth": 0.3, 
-        "axisTickSize": 3, 
-        "colorSaturation": 1, 
-        "colorValue": 0.5, 
+        "animatedZooms": true,
+        "avoidMinZero": false,
+        "axis": null,
+        "axisLabelColor": "#666666",
+        "axisLabelFontSize": 11,
+        "axisLabelFormatter": null,
+        "axisLabelWidth": 50,
+        "axisLineColor": "#AAAAAA",
+        "axisLineWidth": 0.3,
+        "axisTickSize": 3,
+        "colorSaturation": 1,
+        "colorValue": 0.5,
         "colors": [
-            "#FF0097", 
-            "#EF8158", 
-            "#83BB32", 
-            "#182B53", 
-            "#4596FF", 
-            "#553DC9", 
-            "#AD3238", 
-            "#00FFBC", 
+            "#FF0097",
+            "#EF8158",
+            "#83BB32",
+            "#182B53",
+            "#4596FF",
+            "#553DC9",
+            "#AD3238",
+            "#00FFBC",
             "#F1D950"
-        ], 
-        "connectSeparatedPoints": false, 
-        "customBars": false, 
-        "dateWindow": null, 
-        "delimiter": ",", 
-        "digitsAfterDecimal": 2, 
-        "displayAnnotations": false, 
-        "drawPoints": true, 
-        "drawXAxis": true, 
-        "drawXGrid": true, 
-        "drawYAxis": true, 
-        "drawYGrid": true, 
-        "errorBars": false, 
-        "file": null, 
-        "fillAlpha": 0.15, 
-        "fillGraph": false, 
-        "fractions": false, 
-        "gridLineColor": "#D8D8D8", 
-        "gridLineWidth": 0.3, 
-        "hideOverlayOnMouseOut": false, 
-        "highlightCircleSize": 4, 
-        "includeZero": false, 
-        "interactionModel": null, 
-        "isZoomedIgnoreProgrammaticZoom": false, 
-        "labels": null, 
-        "labelsDiv": null, 
-        "labelsDivStyles": null, 
-        "labelsDivWidth": 250, 
-        "labelsKMB": true, 
-        "labelsKMG2": false, 
-        "labelsSeparateLines": true, 
-        "labelsShowZeroValues": true, 
-        "legend": "always", 
-        "logscale": true, 
-        "maxNumberWidth": 30, 
-        "panEdgeFraction": null, 
-        "pixelsPerLabel": null, 
-        "pixelsPerXLabel": null, 
-        "pixelsPerYLabel": null, 
-        "pointSize": 1, 
-        "rangeSelectorHeight": 40, 
-        "rangeSelectorPlotFillColor": "#A7B1C4", 
-        "rangeSelectorPlotStrokeColor": "#808FAB", 
-        "rightGap": 20, 
-        "rollPeriod": 1, 
-        "showLabelsOnHighlight": true, 
-        "showRangeSelector": false, 
-        "showRoller": false, 
-        "sigFigs": null, 
-        "sigma": 2, 
-        "stackedGraph": false, 
-        "stepPlot": false, 
-        "strokePattern": null, 
-        "strokeWidth": 3, 
-        "ticker": null, 
-        "title": null, 
-        "titleHeight": 18, 
-        "valueFormatter": null, 
-        "valueRange": null, 
-        "visibility": null, 
-        "wilsonInterval": true, 
-        "xAxisHeight": null, 
-        "xAxisLabelFormatter": null, 
-        "xAxisLabelWidth": 55, 
-        "xLabelHeight": 18, 
-        "xValueFormatter": null, 
-        "xValueParser": null, 
-        "xlabel": null, 
-        "y2label": null, 
-        "yAxisLabelFormatter": null, 
-        "yAxisLabelWidth": 50, 
-        "yLabelWidth": 18, 
-        "yValueFormatter": null, 
+        ],
+        "connectSeparatedPoints": false,
+        "customBars": false,
+        "dateWindow": null,
+        "delimiter": ",",
+        "digitsAfterDecimal": 2,
+        "displayAnnotations": false,
+        "drawPoints": true,
+        "drawXAxis": true,
+        "drawXGrid": true,
+        "drawYAxis": true,
+        "drawYGrid": true,
+        "errorBars": false,
+        "file": null,
+        "fillAlpha": 0.15,
+        "fillGraph": false,
+        "fractions": false,
+        "gridLineColor": "#D8D8D8",
+        "gridLineWidth": 0.3,
+        "hideOverlayOnMouseOut": false,
+        "highlightCircleSize": 4,
+        "includeZero": false,
+        "interactionModel": null,
+        "isZoomedIgnoreProgrammaticZoom": false,
+        "labels": null,
+        "labelsDiv": null,
+        "labelsDivStyles": null,
+        "labelsDivWidth": 250,
+        "labelsKMB": true,
+        "labelsKMG2": false,
+        "labelsSeparateLines": true,
+        "labelsShowZeroValues": true,
+        "legend": "always",
+        "logscale": true,
+        "maxNumberWidth": 30,
+        "panEdgeFraction": null,
+        "pixelsPerLabel": null,
+        "pixelsPerXLabel": null,
+        "pixelsPerYLabel": null,
+        "pointSize": 1,
+        "rangeSelectorHeight": 40,
+        "rangeSelectorPlotFillColor": "#A7B1C4",
+        "rangeSelectorPlotStrokeColor": "#808FAB",
+        "rightGap": 20,
+        "rollPeriod": 1,
+        "showLabelsOnHighlight": true,
+        "showRangeSelector": false,
+        "showRoller": false,
+        "sigFigs": null,
+        "sigma": 2,
+        "stackedGraph": false,
+        "stepPlot": false,
+        "strokePattern": null,
+        "strokeWidth": 3,
+        "ticker": null,
+        "title": null,
+        "titleHeight": 18,
+        "valueFormatter": null,
+        "valueRange": null,
+        "visibility": null,
+        "wilsonInterval": true,
+        "xAxisHeight": null,
+        "xAxisLabelFormatter": null,
+        "xAxisLabelWidth": 55,
+        "xLabelHeight": 18,
+        "xValueFormatter": null,
+        "xValueParser": null,
+        "xlabel": null,
+        "y2label": null,
+        "yAxisLabelFormatter": null,
+        "yAxisLabelWidth": 50,
+        "yLabelWidth": 18,
+        "yValueFormatter": null,
         "ylabel": "Number of Editors"
-    }, 
+    },
 
-    "slug": "test",         
-    "id": "active_editors", 
+    "slug": "test",
+    "id": "active_editors",
     "name": "Active Wikimedia Editors for All Wikimedia Projects (5+ edits per month)",
-    "desc": "Aug 2010: Editors on Commons are no longer included in overall total, on the assumption that most also edit on one or more other projects. More precise detection of double counts between any projects and languages is in development (using Single User Login registration).", 
+    "desc": "Aug 2010: Editors on Commons are no longer included in overall total, on the assumption that most also edit on one or more other projects. More precise detection of double counts between any projects and languages is in development (using Single User Login registration).",
     "notes": "",
     "height": 250,
-    "width": "auto",        
+    "width": "auto",
     "parents": ["root"],
     
     "data": {
@@ -116,8 +116,8 @@
             "index": 0,
             "source_id": "rc_active_editors_count",
             "source_col": 1,
-            "label": "Total",                        
-            "color": "#E62F74",            
+            "label": "Total!",
+            "color": "#E62F74",
             "type": "int",
             "timespan": {
                 "start": null,
@@ -135,8 +135,8 @@
             "index": 0,
             "source_id": "rc_active_editors_count",
             "source_col": 2,
-            "label": "English",                        
-            "color": "#E62F74",            
+            "label": "English",
+            "color": "#E62F74",
             "type": "int",
             "timespan": {
                 "start": null,
@@ -154,8 +154,8 @@
             "index": 0,
             "source_id": "rc_active_editors_count",
             "source_col": 3,
-            "label": "Commons",                        
-            "color": "#E62F74",            
+            "label": "Commons",
+            "color": "#E62F74",
             "type": "int",
             "timespan": {
                 "start": null,
@@ -173,8 +173,8 @@
             "index": 0,
             "source_id": "rc_active_editors_count",
             "source_col": 4,
-            "label": "French",                        
-            "color": "#E62F74",            
+            "label": "French",
+            "color": "#E62F74",
             "type": "int",
             "timespan": {
                 "start": null,
@@ -192,8 +192,8 @@
             "index": 0,
             "source_id": "rc_active_editors_count",
             "source_col": 5,
-            "label": "German",                        
-            "color": "#E62F74",            
+            "label": "German",
+            "color": "#E62F74",
             "type": "int",
             "timespan": {
                 "start": null,
@@ -211,8 +211,8 @@
             "index": 0,
             "source_id": "rc_active_editors_count",
             "source_col": 6,
-            "label": "Russian",                        
-            "color": "#E62F74",            
+            "label": "Russian",
+            "color": "#E62F74",
             "type": "int",
             "timespan": {
                 "start": null,

diff --git a/docs/framework.md b/docs/internals/framework.md
similarity index 100%
rename from docs/framework.md
rename to docs/internals/framework.md

diff --git a/lib/graph/graph-view.co b/lib/graph/graph-view.co
index 3a4617e..322438a 100644 (file)
--- a/lib/graph/graph-view.co
+++ b/lib/graph/graph-view.co
@@ -173,13 +173,6 @@ GraphView = exports.GraphView = BaseView.extend do # {{{
         this
     
     /**
-     * Render the callout element.
-     */
-    renderCallout: ->
-        
-        this
-    
-    /**
      * Render the chart and other Graph-derived view components.
      */
     render: ->

diff --git a/lib/server/controllers/graph.co b/lib/server/controllers/graph.co
index 50a11bb..c7f2462 100644 (file)
--- a/lib/server/controllers/graph.co
+++ b/lib/server/controllers/graph.co
@@ -65,7 +65,7 @@ class GraphController extends Controller
         catch err
             console.error "GraphController.autoload(#id, #{typeof cb}) -->\nerr"
             cb err
-
+    
     # GET /graphs.:format?
     index: (req, res) ->
         # if format is json, then return the graph JSON
@@ -79,7 +79,7 @@ class GraphController extends Controller
                     .seq   (graphs) -> res.send _.values graphs
             default 
                 res.render 'graph/index'
-
+    
     # GET /graphs/:graph
     show: (req, res) ->
         if req.format is 'json'

diff --git a/lib/template/graph/graph-display.jade b/lib/template/graph/graph-display.jade
index d957a66..fa4a612 100644 (file)
--- a/lib/template/graph/graph-display.jade
+++ b/lib/template/graph/graph-display.jade
@@ -2,9 +2,7 @@ include ../browser-helpers
 - var graph_id = view.id
 section.graph-display.graph(id=graph_id)
     
-    .graph-name-row.page-header.row-fluid
-        h2.graph-name
-            a(id="graph-title", href="#{model.toLink()}", data-bind='name') #{name}
+    .graph-name-row.row-fluid
         .callout
             .latest-metric(data-bind='callout.latest') #{callout.latest}
             .metric-change.year-over-year
@@ -13,6 +11,8 @@ section.graph-display.graph(id=graph_id)
             .metric-change.month-over-month
                 span.dates(data-bind='callout.month.dates') #{callout.month.dates}
                 span.value(data-bind='callout.month.value') #{callout.month.value}
+        h2.graph-name
+            a(id="graph-title", href="#{model.toLink()}", data-bind='name') #{name}
     
     .graph-viewport-row.row-fluid
         .viewport

diff --git a/www/css/graph-display.styl b/www/css/graph-display.styl
index 07f9e66..b7c50ea 100644 (file)
--- a/www/css/graph-display.styl
+++ b/www/css/graph-display.styl
@@ -9,14 +9,16 @@ section.graph-display.graph
     *
         position relative
     
+    .graph-name-row
+        clearfix()
+    
     /* * * *  Chart & Viewport  * * * {{{ */
     .callout
-        absolute top 0 right 1em
+        float right
         z-index 100
         width 200px
-        padding 0 0 2em 4em
+        padding 0 1em 0 0
         font 11px/1.5 "helvetica neue", helvetica, arial, sans-serif
-        border-radius 5px
         background-color white
         text-align right
         
@@ -27,10 +29,13 @@ section.graph-display.graph
             // line-height 24px
             span
                 display inline-block
-                width 100px
+                &.dates
+                    width 140px
+                &.value
+                    width 60px
     
     .graph-legend
-        absolute top 2em right 1em
+        absolute top 1em right 1em
         z-index 100
         width 200px
         

diff --git a/www/css/graph.styl b/www/css/graph.styl
index f29d9d1..9ccff5d 100644 (file)
--- a/www/css/graph.styl
+++ b/www/css/graph.styl
@@ -27,12 +27,11 @@ section.graph
         overflow hidden
     
     .callout
-        absolute top 0 right 1em
+        float right
         z-index 100
         width 200px
-        padding 0 0 2em 4em
-        font 12px/1.5 "helvetica neue", helvetica, arial, sans-serif
-        border-radius 5px
+        padding 0 1em 0 0
+        font 11px/1.5 "helvetica neue", helvetica, arial, sans-serif
         background-color white
         text-align right
         
@@ -40,13 +39,12 @@ section.graph
             font-size 18px
             line-height 36px
         .metric-change
-            // line-height 24px
             span
                 display inline-block
                 width 100px
     
     .graph-legend
-        absolute top 2em right 1em
+        absolute top 1em right 1em
         z-index 100
         width 200px
         
@@ -77,7 +75,6 @@ section.graph
     /* * * *  Graph Details & Info Pane  * * * {{{ */
     .graph-name-row
         // Accommodate the callout box
-        padding-right 272px
         margin 0 0 1em
         min-height 38px