yul/bookwyrm-mastodon
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

starts replacing pure css buttons with javascript buttons

Browse Source 
RIP, but it was time
This commit is contained in:
Mouse Reeve
2021-01-17 08:26:28 -08:00
parent 2e043f9252
commit afdf5fc8ec
11 changed files with 191 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
bookwyrm/static/css/format.css
View File

@ -14,10 +14,13 @@
}
/* --- TOGGLES --- */
[aria-pressed=true] {
.toggle-button[aria-pressed=true], .toggle-button[aria-pressed=true]:hover {
background-color: hsl(171, 100%, 41%);
color: white;
}
.hide-active[aria-pressed=true] {
display: none;
}
input.toggle-control {
display: none;

32
bookwyrm/static/js/shared.js
View File

@ -52,33 +52,51 @@ function setDisplay(el) {
function toggleAction(e) {
var pressed = e.currentTarget.getAttribute('aria-pressed') == 'false';
e.currentTarget.setAttribute('aria-pressed', pressed);
var el = e.currentTarget;
var targetId = el.getAttribute('data-controls');
document.querySelectorAll('[data-controls="' + targetId + '"]')
.forEach(t => t.setAttribute('aria-pressed', !!(t.getAttribute('aria-pressed') == 'false')));
var targetId = e.currentTarget.getAttribute('data-controls');
if (targetId) {
var target = document.getElementById(targetId);
if (pressed) {
target.className = target.className.replace('hidden', '');
removeClass(target, 'hidden');
addClass(target, 'is-active');
} else {
target.className += ' hidden';
addClass(target, 'hidden');
removeClass(target, 'is-active');
}
}
// set hover, if appropriate
var hover = e.currentTarget.getAttribute('data-hover-target');
var hover = el.getAttribute('data-hover-target');
if (hover) {
document.getElementById(hover).focus();
}
// set checkbox, if appropriate
var checkbox = e.currentTarget.getAttribute('data-controls-checkbox');
var checkbox = el.getAttribute('data-controls-checkbox');
if (checkbox) {
document.getElementById(checkbox).checked = !!pressed;
}
}
function addClass(el, classname) {
el.className = el.className.split(' ').concat(classname).join(' ');
}
function removeClass(el, className) {
var classes = el.className.split(' ');
const idx = classes.indexOf(className);
if (idx > -1) {
classes.splice(idx, 1);
}
el.className = classes.join(' ');
}
function interact(e) {
e.preventDefault();
ajaxPost(e.target);