bragi/web/js/util.js
Félix Fischer e981782dd7
Accessibility enhancements: catching a11y errors with WAVE (#180)
* Added alt text for all images

* Added aria labels for most buttons that needed them. Added html language label

* Added remaining button labels

* Added remaining missing labels. Tagged <input> where labels made no sense as "aria-hidden=true"

* Fixed some of the low color contrast issues for Light theme

* Replaced broken ARIA link with a new ARIA label

* Fixed skipped heading levels

* Fixed missing fieldset and one orphaned label (combined the two)

* Changed the other orphaned label to a fieldset legend

* Removed color changes

* Added dynamic ARIA label for main Play/Pause button.
Removed the two FIXMEs in index.html

* Added default content to table header

* Changed input type from text to hidden for hidden inputs

* Added proper alt text for cover art

* Final version of the template row

* Added semantic markup to Page Regions

* Missing alt text + truncated alt text
- Added missing alt text for cover images in library and floating player.
- Added JS to truncate alt text for cover images that was too long.

* Sanitize the code

Co-authored-by: Terry Geng <terry@terriex.com>
2020-07-05 11:42:47 +08:00

35 lines
1.0 KiB
JavaScript

export function isOverflown(element) {
return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
}
export function setProgressBar(bar, progress, text = '') {
const progPos = (-1 * (1 - progress) * bar.scrollWidth).toString();
const progStr = (progress * 100).toString();
bar.setAttribute('aria-valuenow', progStr);
bar.style.transform = 'translateX(' + progPos + 'px)';
bar.textContent = text;
}
export function secondsToStr(seconds) {
seconds = Math.floor(seconds);
const mins = Math.floor(seconds / 60);
const secs = seconds % 60;
return ('00' + mins).slice(-2) + ':' + ('00' + secs).slice(-2);
}
export function coverArtString(title) {
let nameOfSong = "";
// The maximum length before we start truncating
const maxLength = 50;
if (title.length > maxLength) {
// Name = longTitleTooLongToBeAGoodAltTex...
nameOfSong = title.substr(0, maxLength) + "\u2026";
} else {
// Name = shortTitle
nameOfSong = title;
}
return 'Cover art for ' + nameOfSong;
}