external-repos/pa11y-dashboard
2
0
Fork 1
mirror of https://github.com/pa11y/pa11y-dashboard.git synced 2025-09-24 22:31:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

revert spacing issue with public/js/site.js

Browse Source
This commit is contained in:
Alex Kilgour
2016-01-26 14:13:42 +00:00
parent 3cdbba00c1
commit eb8f35779e
1 changed files with 190 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

380
public/js/site.js
View File

@@ -15,109 +15,109 @@
$(document).ready(function(){ $(document).ready(function(){
var data = {}; var data = {};
var standardsList = $('[data-role="standards-list"]'); var standardsList = $('[data-role="standards-list"]');
var standardSelect = $('[data-role="new-task-select"]'); var standardSelect = $('[data-role="new-task-select"]');
var expandLink = $('[data-role="expander"]'); var expandLink = $('[data-role="expander"]');
var taskListSelector = $('[data-role="task-list"] a'); var taskListSelector = $('[data-role="task-list"] a');
var toTopLinks = $('[data-role="top"]'); var toTopLinks = $('[data-role="top"]');
var zoomResetButton = $('[data-role="zoom-reset"]'); var zoomResetButton = $('[data-role="zoom-reset"]');
var graphContainer = $('[data-role="graph"]'); var graphContainer = $('[data-role="graph"]');
var dateSelectDropdownMenu = $('[data-role="date-select-dropdown-menu"]'); var dateSelectDropdownMenu = $('[data-role="date-select-dropdown-menu"]');
var graphOptions = { var graphOptions = {
series: { series: {
lines: { show: true }, lines: { show: true },
points: { show: true }, points: { show: true },
hoverable: true hoverable: true
}, },
xaxis: { xaxis: {
mode: 'time', mode: 'time',
tickLength: 0, tickLength: 0,
minTickSize: [1, 'day'], minTickSize: [1, 'day'],
timeformat: '%d %b' timeformat: '%d %b'
}, },
yaxis: { yaxis: {
tickDecimals: 0 tickDecimals: 0
}, },
lines: { lines: {
lineWidth: 3 lineWidth: 3
}, },
grid: { grid: {
backgroundColor: '#fff', backgroundColor: '#fff',
borderColor: '#808080', borderColor: '#808080',
hoverable: true, hoverable: true,
clickable: true, clickable: true,
borderWidth: { borderWidth: {
top: 1, top: 1,
right: 1, right: 1,
bottom: 1, bottom: 1,
left: 1 left: 1
} }
}, },
selection: { selection: {
mode: 'x' mode: 'x'
} }
}; };
// Toggle appearance of lists of error/warnings/notices // Toggle appearance of lists of error/warnings/notices
expandLink.click( function(){ expandLink.click( function(){
$(this).parent().next().slideToggle('slow', function(){}); $(this).parent().next().slideToggle('slow', function(){});
if ($(this).parent().hasClass('showing')) { if ($(this).parent().hasClass('showing')) {
$(this).html('+'); $(this).html('+');
} }
else { else {
$(this).html('-'); $(this).html('-');
} }
$(this).parent().toggleClass('showing'); $(this).parent().toggleClass('showing');
}); });
// Back to top links // Back to top links
toTopLinks.click( function(e){ toTopLinks.click( function(e){
e.preventDefault(); e.preventDefault();
$(animateSection($('#top'), -55)); $(animateSection($('#top'), -55));
}); });
// Switch standards list of rules // Switch standards list of rules
switchStandardsList(standardSelect); switchStandardsList(standardSelect);
$('.rules-list-title').addClass('hidden'); $('.rules-list-title').addClass('hidden');
$('.date-links').removeClass('list-group date-links').addClass('dropdown-menu'); $('.date-links').removeClass('list-group date-links').addClass('dropdown-menu');
$('.dropdown-menu a').removeClass('list-group-item'); $('.dropdown-menu a').removeClass('list-group-item');
dateSelectDropdownMenu.removeClass('hidden'); dateSelectDropdownMenu.removeClass('hidden');
standardSelect.change( function(){ standardSelect.change( function(){
switchStandardsList($(this)); switchStandardsList($(this));
}); });
taskListSelector.click( function(e) { taskListSelector.click( function(e) {
e.preventDefault(); e.preventDefault();
target = $(this).attr('href'); target = $(this).attr('href');
animateSection($(target), -25); animateSection($(target), -25);
if (!$(target).hasClass('showing')) { if (!$(target).hasClass('showing')) {
$(target).children('[data-role="expander"]').click(); $(target).children('[data-role="expander"]').click();
} }
}); });
zoomResetButton.click( function() { zoomResetButton.click( function() {
plotGraphData(); plotGraphData();
toggleResetZoomButton(); toggleResetZoomButton();
}); });
$.each(graphContainer, function(){ $.each(graphContainer, function(){
getGraphData(); getGraphData();
plotGraphData(); plotGraphData();
}); });
$('[data-role="rules-tooltip"]').tooltip(); $('[data-role="rules-tooltip"]').tooltip();
// Function to animate sections // Function to animate sections
function animateSection (sectionName, offset){ function animateSection (sectionName, offset){
$('html,body').animate({ $('html,body').animate({
scrollTop: $(sectionName).offset().top + offset scrollTop: $(sectionName).offset().top + offset
}, 750); }, 750);
} }
// Standards list switcher for new task form // Standards list switcher for new task form
function switchStandardsList(el){ function switchStandardsList(el){
standardsList.hide(); standardsList.hide();
chosenValue = (el.val()); chosenValue = (el.val());
@@ -125,128 +125,128 @@ $(document).ready(function(){
} }
function getGraphData() { function getGraphData() {
$($('[data-role="url-stats"]').get().reverse()).each( function() { $($('[data-role="url-stats"]').get().reverse()).each( function() {
var el = $(this); var el = $(this);
storeDatum(el, getXAxisLabel(el)); storeDatum(el, getXAxisLabel(el));
}); });
} }
function getXAxisLabel (el) { function getXAxisLabel (el) {
return el.find('[data-role="date"]').attr('data-value'); return el.find('[data-role="date"]').attr('data-value');
} }
function storeDatum (el, label) { function storeDatum (el, label) {
$.each(el.find('[data-label]'), function() { $.each(el.find('[data-label]'), function() {
var type = $(this).attr('data-label'); var type = $(this).attr('data-label');
var value = $(this).html(); var value = $(this).html();
if (typeof data[type] === 'undefined') { if (typeof data[type] === 'undefined') {
data[type] = []; data[type] = [];
} }
data[type].push([label, +value]); data[type].push([label, +value]);
}); });
} }
function plotGraphData () { function plotGraphData () {
$.plot(graphContainer, getData(), graphOptions); $.plot(graphContainer, getData(), graphOptions);
} }
function getData() { function getData() {
return [ return [
{ color: 'rgb(216, 61, 45)', label: 'Errors', data: data.error }, { color: 'rgb(216, 61, 45)', label: 'Errors', data: data.error },
{ color: 'rgb(168, 103, 0)', label: 'Warnings', data: data.warning }, { color: 'rgb(168, 103, 0)', label: 'Warnings', data: data.warning },
{ color: 'rgb(23, 123, 190)', label: 'Notices', data: data.notice } { color: 'rgb(23, 123, 190)', label: 'Notices', data: data.notice }
]; ];
} }
function toggleResetZoomButton() { function toggleResetZoomButton() {
zoomResetButton.toggleClass('hidden'); zoomResetButton.toggleClass('hidden');
} }
graphContainer.bind('plotselected', function (event, ranges) { graphContainer.bind('plotselected', function (event, ranges) {
// clamp the zooming to prevent eternal zoom // clamp the zooming to prevent eternal zoom
if (ranges.xaxis.to - ranges.xaxis.from < 0.00001) { if (ranges.xaxis.to - ranges.xaxis.from < 0.00001) {
ranges.xaxis.to = ranges.xaxis.from + 0.00001; ranges.xaxis.to = ranges.xaxis.from + 0.00001;
} }
if (ranges.yaxis.to - ranges.yaxis.from < 0.00001) { if (ranges.yaxis.to - ranges.yaxis.from < 0.00001) {
ranges.yaxis.to = ranges.yaxis.from + 0.00001; ranges.yaxis.to = ranges.yaxis.from + 0.00001;
} }
// do the zooming // do the zooming
plot = $.plot(graphContainer, getData(ranges.xaxis.from, ranges.xaxis.to), plot = $.plot(graphContainer, getData(ranges.xaxis.from, ranges.xaxis.to),
$.extend(true, {}, graphOptions, { $.extend(true, {}, graphOptions, {
xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to }, xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to },
yaxis: { min: ranges.yaxis.from, max: ranges.yaxis.to } yaxis: { min: ranges.yaxis.from, max: ranges.yaxis.to }
}) })
); );
if (!zoomResetButton.is(':visible')) { if (!zoomResetButton.is(':visible')) {
toggleResetZoomButton(); toggleResetZoomButton();
} }
}); });
var choiceContainer = $('[data-role="series-checkboxes"]'); var choiceContainer = $('[data-role="series-checkboxes"]');
var datasets = getData(); var datasets = getData();
$.each(datasets, function(key, val) { $.each(datasets, function(key, val) {
var lowerCaseValue = (val.label.substring(0, val.label.length - 1)).toLowerCase(); var lowerCaseValue = (val.label.substring(0, val.label.length - 1)).toLowerCase();
choiceContainer.append( choiceContainer.append(
'<li class="text-center ' + lowerCaseValue + '">' + '<li class="text-center ' + lowerCaseValue + '">' +
'<div class="series-checkbox-container">' + '<div class="series-checkbox-container">' +
'<input type="checkbox"' + '<input type="checkbox"' +
'name="' + key + '" ' + 'name="' + key + '" ' +
'id="id' + key + '" ' + 'id="id' + key + '" ' +
'data-stat-type="' + val.label.toLowerCase() + '"' + 'data-stat-type="' + val.label.toLowerCase() + '"' +
'/>' + '/>' +
'<label for="id' + key + '">' + '<label for="id' + key + '">' +
'<span class="stat-type">' + val.label + '</span>' + '<span class="stat-type">' + val.label + '</span>' +
'</label>' + '</label>' +
'</div>' + '</div>' +
'</li>' '</li>'
); );
}); });
choiceContainer.find('input').click(plotAccordingToChoices); choiceContainer.find('input').click(plotAccordingToChoices);
choiceContainer.find('[data-stat-type=errors]').click(); choiceContainer.find('[data-stat-type=errors]').click();
function plotAccordingToChoices() { function plotAccordingToChoices() {
var data = []; var data = [];
choiceContainer.find('input:checked').each(function () { choiceContainer.find('input:checked').each(function () {
var key = $(this).attr('name'); var key = $(this).attr('name');
if (key && datasets[key]) { if (key && datasets[key]) {
data.push(datasets[key]); data.push(datasets[key]);
} }
}); });
if (data.length > -1) { if (data.length > -1) {
$.plot(graphContainer, data, graphOptions); $.plot(graphContainer, data, graphOptions);
} }
} }
function showTooltip(x, y, contents) { function showTooltip(x, y, contents) {
$('<div data-role="tooltip" class="tooltip tooltip-graph in"><div class="tooltip-inner">' + $('<div data-role="tooltip" class="tooltip tooltip-graph in"><div class="tooltip-inner">' +
contents + contents +
'</div></div>').css({top: y + 5,left: x + 5}).appendTo('body').fadeIn(200); '</div></div>').css({top: y + 5,left: x + 5}).appendTo('body').fadeIn(200);
} }
var previousPoint = null; var previousPoint = null;
graphContainer.bind('plothover', function (event, pos, item) { graphContainer.bind('plothover', function (event, pos, item) {
if (item) { if (item) {
if (previousPoint != item.dataIndex) { if (previousPoint != item.dataIndex) {
previousPoint = item.dataIndex; previousPoint = item.dataIndex;
$('[data-role="tooltip"]').remove(); $('[data-role="tooltip"]').remove();
var count = item.datapoint[1].toFixed(0); var count = item.datapoint[1].toFixed(0);
var date = $.plot.formatDate(new Date(item.datapoint[0]), '%d %b' + var date = $.plot.formatDate(new Date(item.datapoint[0]), '%d %b' +
'<small> (%H:%M)</small>'); '<small> (%H:%M)</small>');
var contents = '<p class="crunch">' + var contents = '<p class="crunch">' +
date + '<br/>' + date + '<br/>' +
count + ' ' + item.series.label + count + ' ' + item.series.label +
'</[h6]>'; '</[h6]>';
showTooltip(item.pageX, item.pageY, contents); showTooltip(item.pageX, item.pageY, contents);
} }
} else { } else {
$('[data-role="tooltip"]').remove(); $('[data-role="tooltip"]').remove();
previousPoint = null; previousPoint = null;
} }
}); });
// Task filter // Task filter