1
0
Fork 0

css + closeable groups

This commit is contained in:
Heiko Kernbach 2013-05-22 13:46:24 +02:00
parent f4074c0fb4
commit fb1dfcfdd8
3 changed files with 36 additions and 8 deletions

View File

@ -21,16 +21,26 @@
margin-top: 6px; margin-top: 6px;
} }
.group-close, .group-open {
float:right;
margin-top: 17px !important;
margin-right: 7px !important;
}
.db-zoom, .db-minimize, .db-hide, .db-info { .db-zoom, .db-minimize, .db-hide, .db-info {
float: right; float: right;
margin-top: -4px !important; margin-top: -4px !important;
margin-right: 4px !important; margin-right: 4px !important;
} }
.db-zoom:hover, .db-minimize:hover, .db-hide, .db-info:hover { .db-zoom:hover, .db-minimize:hover, .db-hide, .db-info:hover, .group-close:hover, .group-open:hover {
cursor:pointer; cursor:pointer;
} }
.groupHidden li {
display:none;
}
.statGroups { .statGroups {
margin-left: 0px; margin-left: 0px;
float:left; float:left;

View File

@ -479,8 +479,9 @@ nv.models.axis = function() {
.attr('transform', function(d,i,j) { return 'rotate(' + rotateLabels + ' 0,0)' }) .attr('transform', function(d,i,j) { return 'rotate(' + rotateLabels + ' 0,0)' })
.attr('text-anchor', rotateLabels%360 > 0 ? 'start' : 'end'); .attr('text-anchor', rotateLabels%360 > 0 ? 'start' : 'end');
} }
axisLabel.enter().append('text').attr('class', 'nv-axislabel') axisLabel.enter().append('text').attr('class', 'nv-axislabel nv-x-axislabel')
.attr('text-anchor', 'middle') .attr('text-anchor', 'middle')
.attr('class', 'heikotestclass')
.attr('y', xLabelMargin); .attr('y', xLabelMargin);
var w = (scale.range().length==2) ? scale.range()[1] : (scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0])); var w = (scale.range().length==2) ? scale.range()[1] : (scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]));
axisLabel axisLabel

View File

@ -3,7 +3,7 @@ var dashboardView = Backbone.View.extend({
updateInterval: 1000, // 1 second, constant updateInterval: 1000, // 1 second, constant
updateFrequency: 5, // the actual update rate (5 s) updateFrequency: 5, // the actual update rate (5 s)
updateCounter: 0, updateCounter: 0,
arraySize: 99, // how many values will we keep per figure? arraySize: 20, // how many values will we keep per figure?
seriesData: {}, seriesData: {},
charts: {}, charts: {},
units: [], units: [],
@ -47,10 +47,12 @@ var dashboardView = Backbone.View.extend({
events: { events: {
"click .dashboard-dropdown li" : "checkEnabled", "click .dashboard-dropdown li" : "checkEnabled",
"click .interval-dropdown li" : "checkInterval", "click .interval-dropdown li" : "checkInterval",
"click .db-zoom" : "renderDetailChart", "click .db-zoom" : "renderDetailChart",
"click .db-minimize" : "checkDetailChart", "click .db-minimize" : "checkDetailChart",
"click .db-hide" : "hideChart" "click .db-hide" : "hideChart",
"click .group-close" : "hideGroup",
"click .group-open" : "showGroup"
}, },
template: new EJS({url: 'js/templates/dashboardView.ejs'}), template: new EJS({url: 'js/templates/dashboardView.ejs'}),
@ -72,9 +74,10 @@ var dashboardView = Backbone.View.extend({
var counter = 1; var counter = 1;
$.each(this.options.description.models[0].attributes.groups, function () { $.each(this.options.description.models[0].attributes.groups, function () {
console.log(self.options.description.models[0].attributes.groups.length); console.log(this);
$('.thumbnails').append( $('.thumbnails').append(
'<ul class="statGroups" id="' + this.group + '">' + '<ul class="statGroups" id="' + this.group + '">' +
'<i class="group-close icon-minus icon-white"></i>' +
'<h4 class="statsHeader">' + this.name + '</h4>' + '<h4 class="statsHeader">' + this.name + '</h4>' +
'</ul>'); '</ul>');
$('#menuGroups').append('<li class="nav-header">' + this.name + '</li>'); $('#menuGroups').append('<li class="nav-header">' + this.name + '</li>');
@ -214,6 +217,20 @@ var dashboardView = Backbone.View.extend({
} }
}, },
hideGroup: function (a) {
var group = $(a.target).parent();
$(a.target).removeClass('icon-minus group-close');
$(a.target).addClass('icon-plus group-open');
$(group).addClass("groupHidden");
},
showGroup: function (a) {
var group = $(a.target).parent();
$(a.target).removeClass('icon-plus group-open');
$(a.target).addClass('icon-minus group-close');
$(group).removeClass("groupHidden");
},
hideChart: function (a) { hideChart: function (a) {
var figure = $(a.target).attr("value"); var figure = $(a.target).attr("value");
$('#'+figure+'Checkbox').prop('checked', false); $('#'+figure+'Checkbox').prop('checked', false);