Schedule divisions and workshops table

This commit is contained in:
Godwin
2017-08-20 16:04:39 -07:00
parent c1f9b5db82
commit ad3136a5cb
13 changed files with 614 additions and 280 deletions
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 26.25"><path d="M0 21h24V0H0v21zM19 1h4v3h-4V1zm0 4h4v3h-4V5zm0 4h4v3h-4V9zm0 4h4v3h-4v-3zm0 4h4v3h-4v-3zM14 1h4v3h-4V1zm0 4h4v3h-4V5zm0 4h4v3h-4V9zm0 4h4v3h-4v-3zm0 4h4v3h-4v-3zM9 1h4v3H9V1zm0 4h4v3H9V5zm0 4h4v3H9V9zm0 4h4v3H9v-3zm0 4h4v3H9v-3zM1 1h7v3H1V1zm0 4h7v3H1V5zm0 4h7v3H1V9zm0 4h7v3H1v-3zm0 4h7v3H1v-3z"/></svg>

After

Width:  |  Height:  |  Size: 377 B

+109 -109
View File
@@ -1,114 +1,114 @@
(function() {
function closeWorkshopSelector() {
document.getElementById('workshop-selector').classList.remove('open');
document.body.classList.remove('modal-open');
}
document.getElementById('workshop-selector').addEventListener('click', function(event) {
if (event.target.id == 'workshop-selector') {
closeWorkshopSelector();
}
});
function _post(form, params, f) {
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (request.readyState == 4) {
if (request.status == 200) {
f(request.responseText);
}
}
}
request.open('POST', form.getAttribute('action'), true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
params['authenticity_token'] = form.querySelector('[name="authenticity_token"]').value;
var data = [];
for (var key in params) {
data.push(key + '=' + params[key]);
}
request.send(data.join('&'));
}
function selectorMatches(el, selector) {
var p = Element.prototype;
var f = p.matches || p.webkitMatchesSelector || p.mozMatchesSelector || p.msMatchesSelector || function(s) {
return [].indexOf.call(document.querySelectorAll(s), this) !== -1;
};
return f.call(el, selector);
}
function updateSchedule(html) {
var schedule = document.getElementById('schedule-preview');
var s = document.createElement('div');
s.innerHTML = html;
schedule.innerHTML = s.children[0].innerHTML;
schedule.classList.remove('requesting');
}
function closeWorkshopSelector() {
document.getElementById('workshop-selector').classList.remove('open');
document.body.classList.remove('modal-open');
}
document.getElementById('workshop-selector').addEventListener('click', function(event) {
if (event.target.id == 'workshop-selector') {
closeWorkshopSelector();
}
});
function _post(form, params, f) {
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (request.readyState == 4) {
if (request.status == 200) {
f(request.responseText);
}
}
}
request.open('POST', form.getAttribute('action'), true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
params['authenticity_token'] = form.querySelector('[name="authenticity_token"]').value;
var data = [];
for (var key in params) {
data.push(key + '=' + params[key]);
}
request.send(data.join('&'));
}
function selectorMatches(el, selector) {
var p = Element.prototype;
var f = p.matches || p.webkitMatchesSelector || p.mozMatchesSelector || p.msMatchesSelector || function(s) {
return [].indexOf.call(document.querySelectorAll(s), this) !== -1;
};
return f.call(el, selector);
}
function updateSchedule(html) {
var schedule = document.getElementById('schedule-preview');
var s = document.createElement('div');
s.innerHTML = html;
schedule.innerHTML = s.children[0].innerHTML;
schedule.classList.remove('requesting');
}
document.body.addEventListener('submit', function (event) {
if (event.target.classList.contains('deschedule-workshop')) {
event.preventDefault();
var schedule = document.getElementById('schedule-preview');
var form = event.target;
schedule.classList.add('requesting');
_post(
form,
{
id: form.querySelector('[name="id"]').value,
button: 'deschedule_workshop'
},
updateSchedule
);
}
});
document.body.addEventListener('click', function (event) {
//console.log(event.target);
if (selectorMatches(event.target, 'td.workshop.open, td.workshop.open *')) {
//event.stopPropagation();
var button = event.target;
while (button && button.tagName && button.tagName !== 'TD') {
button = button.parentElement;
}
document.body.addEventListener('submit', function (event) {
if (event.target.classList.contains('deschedule-workshop')) {
event.preventDefault();
var schedule = document.getElementById('schedule-preview');
var form = event.target;
schedule.classList.add('requesting');
_post(
form,
{
id: form.querySelector('[name="id"]').value,
button: 'deschedule_workshop'
},
updateSchedule
);
}
});
document.body.addEventListener('click', function (event) {
if (selectorMatches(event.target, 'td.workshop.open, td.workshop.open *')) {
var button = event.target;
while (button && button.tagName && button.tagName !== 'TD') {
button = button.parentElement;
}
document.getElementById('workshop-selector').classList.add('open');
var table = document.getElementById('table');
table.classList.add('loading');
document.body.classList.add('modal-open');
document.getElementById('workshop-selector').classList.add('open');
var table = document.getElementById('table');
table.classList.add('loading');
document.body.classList.add('modal-open');
var block = button.getAttribute('data-block');
var day = button.getAttribute('data-day');
var location = button.getAttribute('data-location');
_post(
document.getElementById('workshop-table-form'),
{
block: block,
day: day,
location: location,
button: 'get-workshop-list'
},
function (response) {
var table = document.getElementById('table');
table.innerHTML = response;
table.classList.remove('loading');
forEachElement('tr.selectable', function(row) {
row.addEventListener('click', function(event) {
var schedule = document.getElementById('schedule-preview');
schedule.classList.add('requesting');
closeWorkshopSelector();
var form = document.getElementById('workshop-table-form');
_post(
form,
{
workshop: row.getAttribute('data-workshop'),
block: block,
day: day,
location: form.querySelector('#event_location').value,
button: 'set-workshop'
},
updateSchedule
);
});
}, table);
}
);
}
}, true);
var block = button.getAttribute('data-block');
var day = button.getAttribute('data-day');
var location = button.getAttribute('data-location');
var division = button.getAttribute('data-division');
_post(
document.getElementById('workshop-table-form'),
{
block: block,
day: day,
location: location,
division: division,
button: 'get-workshop-list'
},
function (response) {
var table = document.getElementById('table');
table.innerHTML = response;
table.classList.remove('loading');
forEachElement('tr.selectable', function(row) {
row.addEventListener('click', function(event) {
var schedule = document.getElementById('schedule-preview');
schedule.classList.add('requesting');
closeWorkshopSelector();
var form = document.getElementById('workshop-table-form');
_post(
form,
{
workshop: row.getAttribute('data-workshop'),
block: block,
day: day,
location: form.querySelector('#event_location').value,
button: 'set-workshop'
},
updateSchedule
);
});
}, table);
}
);
}
}, true);
})();
+4 -1
View File
@@ -1370,7 +1370,6 @@ nav.sub-menu {
.event-detail-link {
width: auto;
font-size: 1.25em;
}
.event-detail-link, .details, .title {
display: inline;
@@ -1403,6 +1402,10 @@ nav.sub-menu {
width: 15em;
}
li {
white-space: normal;
}
+ .event-detail-link {
padding-right: 1em;
}