Fixed error deleting a workshop

2016-08-22 11:17:55 -07:00
parent 3940a0b0cc
commit 15483c13df
6 changed files with 303 additions and 31 deletions
@@ -2,7 +2,7 @@
 	var searchControl = document.getElementById('search');

 	function filterTable() {
-		forEach(document.getElementById('search-rows').getElementsByTagName('tr'), function(tr) {
+		forEach(document.getElementById('search-table').getElementsByTagName('TBODY')[0].getElementsByTagName('TR'), function(tr) {
 			tr.classList.remove('hidden');

 			var value = searchControl.value;
@@ -18,6 +18,78 @@
 		});
 	}

+	// ref = https://davidwalsh.name/element-matches-selector
+	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 saveRow(row) {
+		if (row) {
+			row.classList.remove('editing');
+			/*row.removeAttribute('data-editing');
+			forEach(row.getElementsByTagName('TD'), function(cell) {
+				var input = cell.getElementsByClassName('cell-editor')[0];
+				if (input) {
+					cell.removeChild(input);
+				}
+
+			});*/
+		}
+	}
+
+	function editTableCell(cell) {
+		if (selectorMatches(cell, 'tr[data-key].editable td')) {
+			editTableRow(cell.parentElement, cell);
+		}
+		/*var currentRow = document.querySelector('[data-key][data-editing="1"]');
+		if (currentRow && !currentRow.contains(cell)) {
+			saveRow(currentRow);
+		}
+
+		if (selectorMatches(cell, 'tr[data-key] td[name]')) {
+			if (!cell.getElementsByClassName('cell-editor').length) {
+				//var tr = cell.parentElement;
+
+				//saveRow(document.querySelector('[data-key][data-editing="1"]'), tr);
+				cell.parentElement.setAttribute('data-editing', "1");
+
+				var value = cell.innerHTML;
+				cell.innerHTML += '<textarea type="text" name="' + cell.getAttribute('name') + '" class="cell-editor">' + value + '</textarea>';
+				cell.parentElement.classList.add();
+				setTimeout(function() { cell.getElementsByClassName('cell-editor')[0].focus(); }, 100);
+			}
+		}*/
+	}
+	function editTableRow(row, cell) {
+		if (selectorMatches(row, 'tr[data-key].editable')) {
+			var key = row.getAttribute('data-key');
+			var currentRow = document.querySelector('tr[data-key].editable.editing');
+			if (currentRow && currentRow.getAttribute('data-key') !== key) {
+				saveRow(currentRow);
+			}
+			var editor = row.nextSibling;
+			if (!row.classList.contains('editing')) {
+				row.classList.add('editing');
+				var focusElement = null;
+				if (cell) {
+					focusElement = editor.querySelector('td[data-column-id="' + cell.getAttribute('data-column-id') + '"] .cell-editor');
+				}
+				(focusElement || editor.getElementsByClassName('cell-editor')[0]).focus();
+			}
+		}
+	}
+	document.addEventListener('click', function (event) { editTableCell(event.target); });
+	if (document.observe) {
+		document.observe("focusin", function (event) { editTableCell(event.target); });
+	} else {
+		document.addEventListener("focus", function (event) { editTableCell(event.target); }, true);
+		// document.addEventListener("focus", function (event) { editTableCell(event.target); }, true);
+	}
+
 	searchControl.addEventListener('keyup', filterTable);
 	searchControl.addEventListener('search', filterTable);
 })();
@@ -183,10 +183,108 @@ table, .table {
 	tr.hidden {
 		display: none;
 	}
+
+	tr[data-key] {
+		cursor: default;
+		
+		&:hover {
+			background-color: lighten($colour-2, 33%);
+		}
+
+		&.editable {
+			+ .editor {
+				display: none;
+				background-color: lighten($colour-1, 50%);
+				
+				td {
+					position: relative;
+					vertical-align: top;
+					background: inherit;
+					cursor: default;
+					opacity: 0.5;
+
+					&.has-editor {
+						opacity: 1;
+					}
+
+					.cell-editor {
+						top: 0;
+						right: 0;
+						bottom: 0;
+						left: 0;
+						padding: inherit;
+						font: inherit;
+						margin: inherit;
+						background: inherit;
+						border: 0;
+						min-height: 0;
+						width: 100% !important;
+						border-radius: 0;
+						line-height: inherit;
+						overflow: hidden;
+						box-shadow: none;
+						text-align: inherit;
+						//border-bottom: 0.25em solid rgba(0,0,0,0.25);
+					}
+					select.cell-editor {
+						-webkit-appearance: none;
+						-moz-appearance: none;
+						-ms-appearance: none;
+						appearance: none;
+						cursor: pointer;
+					}
+				}
+			}
+
+			&.editing {
+				display: none;
+
+				+ .editor {
+					display: table-row;
+
+					.cell-editor {
+						position: absolute;
+					}
+				}
+			}
+		}
+
+		/*td[name] {
+			position: relative;
+			cursor: text;
+
+			&:hover {
+				background-color: lighten($colour-2, 25%);
+			}
+
+			input, textarea, select {
+			}
+		}
+
+		&[data-editing="1"] {
+		}*/
+	}
+
+	tr.editable, tr.editor {
+		td {
+			white-space: nowrap;
+
+			&.text {
+				white-space: normal;
+			}
+
+			&.date, &.datetime, &.money {
+				font-family: monospace;
+				font-size: 1.25em;
+				text-align: right;
+			}
+		}
+	}
 }

 .table-scroller {
 	overflow: auto;
+	background-color: $white;
 }

 .table {