- (Date range selector & scrubber?)
- Metric Presentation: color, label, formatting, and transform (low-pri -- can hardcode for now)
- [Graph Edit UI]
- - Redraw button
- - Tabbed main container
- - Add new tags + tag for "common"/"important" options
+ - Add option for a "Benchmark Value" on the graph
+ - Annotations
+ - Tag options with "advanced", make modal UI
- List tags to toggle all matching options
- (work beyond here is low-pri)
- non-lib option: redraw graph on page resize
- Reset all options to defaults
- Outline modified options
- Save to server
- - Add option for a "Benchmark Value" on the graph
### later
-- Add cascade (presets) to graph options
- [Graph Edit UI]
- Filter/Sort attributes, datasets, etc
- Outline all changed options
## features
+- Graphs should have tags
- Ability to merge & filter datasets
- Discoverable & Self-Describing Data Sources
- ToC endpoint
*/
updateURL: ->
data = @toJSON()
- title = @model.get('name', root.document?.title or '')
+ title = "#{@model.get('name') or 'New Graph'} | Edit Graph | GraphKit"
url = @toURL()
# console.log 'History.pushState', JSON.stringify(data), title, url
History.pushState data, title, url
.graph-settings.tabbable
//- nav.navbar: div.navbar-inner: div.container
nav
+ .graph-controls.pull-right
+ .btn-group
+ a.redraw-button.btn(href="#")
+ i.icon-refresh
+ | Redraw
+ .btn-group
+ a.load-button.btn(href="#")
+ i.icon-download
+ | Revert
+ a.save-button.btn(href="#")
+ i.icon-upload
+ | Save
+ a.done-button.btn-primary.btn(href="#")
+ i.icon-ok-sign.icon-white
+ | Done
ul.nav.subnav.nav-pills
li: h3 Graph
li.active: a(href="#graph-#{graph_id}-info", data-toggle="tab") Info
li: a(href="#graph-#{graph_id}-data", data-toggle="tab") Data
li: a.graph-options-tab(href="#graph-#{graph_id}-options", data-toggle="tab") Options
- li.graph-controls
- input.redraw-button.btn(type="button", value="Redraw")
- input.load-button.btn(type="button", value="Load")
- input.save-button.btn-success(type="button", value="Save")
+
.tab-content
.graph-info-pane.tab-pane.active(id="graph-#{graph_id}-info")
padding 0.5em
.graph-controls
- float right
+ z-index 100
+ margin-top 2px
+
+ & > .btn, & > .btn-group
+ margin 0 0.5em
+
+ .btn-group
+ display inline-block
input[type="button"]
min-width 5em
- margin 0 0.5em
text-align center
+
/* * * * Graph Details * * * {{{ */
color $body_text
background-color $foot_bgcolor
-a, a:link, a:visited, a:active
- color $body_link
- text-decoration underline
- &:hover
- text-decoration none
+// a:not(.btn)
+// color $body_link
+// text-decoration underline
+// &:hover
+// text-decoration none
h1, h2, h3
font-family $fonts_headers
color $body_text
font-weight 300
- a, a:link, a:visited, a:active
+ a:not(.btn)
color $body_text
text-decoration none
&:hover
footer
color $foot_text
- a, a:link, a:visited, a:active
+ a:not(.btn)
color $foot_link
extends ../layout
block title
- title Kraken: Graph Test Page
+ title Edit Graph | GraphKit
append styles
mixin css('graph.css')