new_technical_debt = @snapshot.measure('new_technical_debt')
if @dashboard_configuration.selected_period?
- period_date = @snapshot.period_datetime(@dashboard_configuration.period_index).strftime('%Y-%m-%d')
+ period_date = @snapshot.period_datetime(@dashboard_configuration.period_index).strftime('%FT%T%z')
end
%>
'<%= grunt.option("assetsDir") || pkg.assets %>js/widgets/tag-cloud.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/widgets/treemap.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/graphics/pie-chart.js'
+ '<%= grunt.option("assetsDir") || pkg.assets %>js/graphics/timeline.js'
+ '<%= grunt.option("assetsDir") || pkg.assets %>js/graphics/barchart.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/top-search.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/sortable.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/common/inputs.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/widgets/tag-cloud.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/widgets/treemap.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/graphics/pie-chart.js'
+ '<%= grunt.option("assetsDir") || pkg.assets %>js/graphics/timeline.js'
+ '<%= grunt.option("assetsDir") || pkg.assets %>js/graphics/barchart.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/top-search.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/sortable.js'
'<%= grunt.option("assetsDir") || pkg.assets %>js/common/inputs.js'
when 'statuses' then StatusFacet
when 'assignees' then AssigneeFacet
when 'resolutions' then ResolutionFacet
- when 'creationDate' then CreationDateFacet
+ when 'createdAt' then CreationDateFacet
when 'projectUuids' then ProjectFacet
when 'moduleUuids' then ModuleFacet
when 'rules' then RuleFacet
events: ->
_.extend super,
'change input': 'applyFacet'
+ 'click .js-select-period-start': 'selectPeriodStart'
+ 'click .js-select-period-end': 'selectPeriodEnd'
onRender: ->
value = query[prop]
@$("input[name=#{prop}]").val value if value?
+ @$('.js-barchart').barchart @model.getValues()
+
+ @$('select').select2
+ width: '100%'
+ minimumResultsForSearch: 999
+
+
+ selectPeriodStart: ->
+ @$('.js-period-start').datepicker 'show'
+
+
+ selectPeriodEnd: ->
+ @$('.js-period-end').datepicker 'show'
+
+
applyFacet: ->
obj = {}
serializeData: ->
_.extend super,
+ periodStart: @options.app.state.get('query').createdAfter
+ periodEnd: @options.app.state.get('query').createdBefore
createdAt: @options.app.state.get('query').createdAt
page: 1
maxResultsReached: false
query: {}
- facets: ['severities', 'resolutions', 'rules', 'tags', 'projectUuids']
+ facets: ['severities', 'resolutions', 'createdAt', 'rules', 'tags', 'projectUuids']
isContext: false
- allFacets: ['issues', 'severities', 'resolutions', 'rules', 'tags', 'statuses', 'projectUuids', 'moduleUuids',
- 'directories', 'fileUuids', 'assignees', 'reporters', 'authors', 'languages', 'actionPlans',
- 'creationDate'],
+ allFacets: ['issues', 'severities', 'resolutions', 'createdAt', 'rules', 'tags', 'statuses', 'projectUuids',
+ 'moduleUuids', 'directories', 'fileUuids', 'assignees', 'reporters', 'authors', 'languages',
+ 'actionPlans'],
facetsFromServer: ['severities', 'statuses', 'resolutions', 'actionPlans', 'projectUuids', 'directories', 'rules',
- 'moduleUuids', 'tags', 'assignees', 'reporters', 'authors', 'fileUuids', 'languages'],
+ 'moduleUuids', 'tags', 'assignees', 'reporters', 'authors', 'fileUuids', 'languages',
+ 'createdAt'],
transform: {
'resolved': 'resolutions'
'assigned': 'assignees'
'planned': 'actionPlans'
- 'createdAt': 'creationDate'
- 'createdBefore': 'creationDate'
- 'createdAfter': 'creationDate'
+ 'createdBefore': 'createdAt'
+ 'createdAfter': 'createdAt'
}
{{dt createdAt}} ({{fromNow createdAt}})
</div>
{{else}}
- <div class="search-navigator-facet-container justify">
- <input type="text" class="search-navigator-facet-input" name="createdAfter" placeholder="From">
- to
- <input type="text" class="search-navigator-facet-input" name="createdBefore" placeholder="To">
+ <div class="search-navigator-facet-container">
+ <div class="js-barchart" data-height="75"></div>
+ <div class="search-navigator-date-facet-selection">
+ <a class="js-select-period-start search-navigator-date-facet-selection-dropdown-left">
+ {{#if periodStart}}{{d periodStart}}{{else}}Past{{/if}} <i class="icon-dropdown"></i>
+ </a>
+ <a class="js-select-period-end search-navigator-date-facet-selection-dropdown-right">
+ {{#if periodEnd}}{{d periodEnd}}{{else}}Now{{/if}} <i class="icon-dropdown"></i>
+ </a>
+ <input class="js-period-start search-navigator-date-facet-selection-input-left"
+ type="text" value="{{#if periodStart}}{{ds periodStart}}{{/if}}" name="createdAfter">
+ <input class="js-period-end search-navigator-date-facet-selection-input-right"
+ type="text" value="{{#if periodEnd}}{{ds periodEnd}}{{/if}}" name="createdBefore">
+ </div>
</div>
{{/if}}
return moment(date).format('LLL');
});
+ Handlebars.registerHelper('ds', function(date) {
+ return moment(date).format('YYYY-MM-DD');
+ });
+
Handlebars.registerHelper('fromNow', function(date) {
return moment(date).fromNow();
});
--- /dev/null
+(function ($) {
+
+ function trans (left, top) {
+ return 'translate(' + left + ', ' + top + ')';
+ }
+
+ var defaults = {
+ height: 140,
+ color: '#1f77b4',
+ interpolate: 'basis'
+ };
+
+ /*
+ * data = [
+ * { val: '2015-01-30', count: 30 },
+ * ...
+ * ]
+ */
+
+ $.fn.barchart = function (data) {
+ $(this).each(function () {
+ var options = _.defaults($(this).data(), defaults);
+ _.extend(options, { width: $(this).width() });
+
+ var container = d3.select(this),
+ svg = container.append('svg')
+ .attr('width', options.width + 2)
+ .attr('height', options.height + 2)
+ .classed('sonar-d3', true),
+
+ plot = svg.append('g')
+ .classed('plot', true),
+
+ xScale = d3.scale.ordinal()
+ .domain(data.map(function (d, i) {
+ return i;
+ })),
+
+ yScaleMax = d3.max(data, function (d) {
+ return d.count;
+ }),
+ yScale = d3.scale.linear()
+ .domain([0, yScaleMax]);
+
+ _.extend(options, {
+ marginLeft: 1,
+ marginRight: 1,
+ marginTop: 18,
+ marginBottom: 1
+ });
+
+ _.extend(options, {
+ availableWidth: options.width - options.marginLeft - options.marginRight,
+ availableHeight: options.height - options.marginTop - options.marginBottom
+ });
+
+ plot.attr('transform', trans(options.marginLeft, options.marginTop));
+ xScale.rangeRoundBands([0, options.availableWidth], 0.05, 0);
+ yScale.range([3, options.availableHeight]);
+
+ var barWidth = xScale.rangeBand(),
+ bars = plot.selectAll('g').data(data);
+
+ if (barWidth > 0) {
+ var barsEnter = bars.enter()
+ .append('g')
+ .attr('transform', function (d, i) {
+ return trans(xScale(i), Math.ceil(options.availableHeight - yScale(d.count)));
+ });
+
+ barsEnter.append('rect')
+ .style('fill', options.color)
+ .attr('width', barWidth)
+ .attr('height', function (d) {
+ return Math.floor(yScale(d.count));
+ })
+ .attr('title', function (d, i) {
+ var beginning = moment(d.val),
+ ending = i < data.length - 1 ? moment(data[i].val).subtract(1, 'days') : moment();
+ return d.count + ' | ' + beginning.format('LL') + ' - ' + ending.format('LL');
+ })
+ .attr('data-placement', 'right')
+ .attr('data-toggle', 'tooltip');
+
+ var maxValue = d3.max(data, function (d) {
+ return d.count;
+ }),
+ isValueShown = false;
+
+ barsEnter.append('text')
+ .classed('subtitle', true)
+ .attr('transform', trans(barWidth / 2, -4))
+ .style('text-anchor', 'middle')
+ .text(function (d) {
+ var text = !isValueShown && d.count === maxValue ? d.count : '';
+ isValueShown = d.count === maxValue;
+ return text;
+ });
+
+ $(this).find('[data-toggle=tooltip]').tooltip({ container: 'body' });
+ }
+ });
+ };
+
+})(window.jQuery);
--- /dev/null
+(function ($) {
+
+ function trans (left, top) {
+ return 'translate(' + left + ', ' + top + ')';
+ }
+
+ var defaults = {
+ height: 140,
+ color: '#1f77b4',
+ interpolate: 'basis'
+ };
+
+ /*
+ * data = [
+ * { val: '2015-01-30', count: 30 },
+ * ...
+ * ]
+ */
+
+ $.fn.timeline = function (data) {
+ $(this).each(function () {
+ var options = _.defaults($(this).data(), defaults);
+ _.extend(options, { width: $(this).width() });
+
+ var container = d3.select(this),
+ svg = container.append('svg')
+ .attr('width', options.width + 2)
+ .attr('height', options.height + 2)
+ .classed('sonar-d3', true),
+
+ plot = svg.append('g')
+ .classed('plot', true),
+
+ xScale = d3.time.scale()
+ .domain(d3.extent(data, function (d) {
+ return new Date(d.val);
+ })),
+
+ yScale = d3.scale.linear()
+ .domain([
+ 0, d3.max(data, function (d) {
+ return d.count;
+ })
+ ]),
+
+ line = d3.svg.line()
+ .x(function (d) {
+ return xScale(new Date(d.val));
+ })
+ .y(function (d) {
+ return yScale(d.count);
+ })
+ .interpolate(options.interpolate),
+
+ minDate = xScale.domain()[0],
+ minDateTick = svg.append('text')
+ .classed('subtitle', true)
+ .text(moment(minDate).format('LL')),
+
+ maxDate = xScale.domain()[1],
+ maxDateTick = svg.append('text')
+ .classed('subtitle', true)
+ .text(moment(maxDate).format('LL'))
+ .style('text-anchor', 'end');
+
+ _.extend(options, {
+ marginLeft: 1,
+ marginRight: 1,
+ marginTop: 1,
+ marginBottom: 1 + maxDateTick.node().getBBox().height
+ });
+
+ _.extend(options, {
+ availableWidth: options.width - options.marginLeft - options.marginRight,
+ availableHeight: options.height - options.marginTop - options.marginBottom
+ });
+
+ plot.attr('transform', trans(options.marginLeft, options.marginTop));
+ xScale.range([0, options.availableWidth]);
+ yScale.range([0, options.availableHeight]);
+
+ minDateTick
+ .attr('x', options.marginLeft)
+ .attr('y', options.height);
+ maxDateTick
+ .attr('x', options.width - options.marginRight)
+ .attr('y', options.height);
+
+ plot.append('path')
+ .datum(data)
+ .attr('d', line)
+ .attr('class', 'line')
+ .style('stroke', options.color);
+
+ });
+ };
+
+})(window.jQuery);
padding: 0 10px 16px;
}
+.search-navigator-facet-container-center {
+ text-align: center;
+}
+
.search-navigator-facet-query {
padding: 7px 10px;
width: @sideWidth * 0.4;
}
+.search-navigator-facet-histogram {
+ font-size: 0;
+
+ > li {
+ display: inline-block;
+ vertical-align: bottom;
+ width: 24px;
+ font-size: @smallFontSize;
+ }
+
+ > li > a {
+ display: block;
+ padding-bottom: 3px;
+ .link-no-underline;
+ .trans(none);
+
+ &:hover, &:focus,
+ &:hover .search-navigator-facet-histogram-bar-inner, &:focus .search-navigator-facet-histogram-bar-inner {
+ background-color: @barBorderColor;
+ }
+
+ &:hover .search-navigator-facet-histogram-bar, &:focus .search-navigator-facet-histogram-bar {
+ background-color: @blue;
+ }
+ }
+}
+
+.search-navigator-facet-histogram-large {
+ > li {
+ width: 48px;
+ }
+}
+
+.search-navigator-facet-histogram-bar {
+ display: block;
+ height: 60px;
+ background-color: @darkBlue;
+}
+
+.search-navigator-facet-histogram-bar-inner {
+ display: block;
+ max-height: 59px;
+ background-color: @barBackgroundColor;
+}
+
+.search-navigator-facet-histogram-label {
+ display: block;
+ text-align: center;
+}
+
+.search-navigator-date-facet-selection {
+ .clearfix;
+ position: relative;
+ font-size: @smallFontSize;
+}
+
+.search-navigator-date-facet-selection-dropdown-left {
+ float: left;
+ .link-no-underline;
+}
+
+.search-navigator-date-facet-selection-dropdown-right {
+ float: right;
+ .link-no-underline;
+}
+
+.search-navigator-date-facet-selection-input-left {
+ position: absolute;
+ left: 0;
+ width: 100px;
+ visibility: hidden;
+}
+
+.search-navigator-date-facet-selection-input-right {
+ position: absolute;
+ right: 0;
+ width: 100px;
+ visibility: hidden;
+}
+
+
.search-navigator-filters {
position: relative;
.clearfix;
issues.facet.rules=Rule
issues.facet.resolutions=Resolution
issues.facet.languages=Language
-issues.facet.creationDate=Creation Date
+issues.facet.createdAt=Creation Date
issues.facet.reporters=Reporter
issues.facet.authors=Author
issues.facet.issues=Issue Key
projects / sonarqube.git / commitdiff