Merge branch 'rails' of 0xacab.org:sutty/sutty into rails

app/assets/javascripts/01-types.js

@@ -259,7 +259,6 @@ const typesWithProperties = {
 
 				const file = imgFileEl.files[0]
 
-				imgEl.src = URL.createObjectURL(file)
 				imgEl.dataset.editorLoading = true
 				uploadFile(file)
 					.then(url => {
@@ -321,7 +320,6 @@ const typesWithProperties = {
 
 				const audioEl = figureEl.querySelector('audio')
 
-				audioEl.src = URL.createObjectURL(file)
 				audioEl.dataset.editorLoading = true
 				uploadFile(file)
 					.then(url => {
@@ -361,7 +359,6 @@ const typesWithProperties = {
 				const file = videoFileEl.files[0]
 
 				videoEl.poster = ""
-				videoEl.src = URL.createObjectURL(file)
 				videoEl.dataset.editorLoading = true
 				uploadFile(file)
 					.then(url => {
@@ -401,7 +398,6 @@ const typesWithProperties = {
 				const file = pdfFileEl.files[0]
 				const pdfEl = figureEl.children[0]
 
-				pdfEl.src = URL.createObjectURL(file)
 				pdfEl.dataset.editorLoading = true
 				uploadFile(file)
 					.then(url => {

app/assets/javascripts/02-editor.js

@@ -25,6 +25,17 @@ const restoreContent = (editorEl, contentEl) => {
 	contentEl.innerHTML = content
 }
 
+/* getRangeAt puede fallar si no hay una selección
+ */
+function safeGetRangeAt (num) {
+	try {
+		return window.getSelection().getRangeAt(num)
+	} catch (error) {
+		console.warn("No hay una selección!")
+		return null;
+	}
+}
+
 function uploadFile (file) {
 	return new Promise((resolve, reject) => {
 		const upload = new ActiveStorage.DirectUpload(
@@ -108,7 +119,8 @@ function setupMarkButton (button, mark, contentEl) {
 		let parentEl = getElementParent(sel.anchorNode)
 		//if (sel.anchorNode == parentEl) parentEl = parentEl.firstChild
 
-		const range = sel.getRangeAt(0)
+		const range = safeGetRangeAt(0)
+		if (!range) return
 
 		if (parentEl.matches(mark.selector)) {
 			const [left, right] = splitNode(parentEl, range)
@@ -169,7 +181,8 @@ function setupBlockButton (button, block, contentEl, editorEl) {
 			|| sel.focusNode == contentEl
 		) return
 
-		const range = sel.getRangeAt(0)
+		const range = safeGetRangeAt(0)
+		if (!range) return
 
 		let parentEl = sel.anchorNode
 		while (!isDirectChild(contentEl, parentEl)) parentEl = parentEl.parentElement
@@ -202,7 +215,8 @@ function setupParentBlockButton (button, parentBlock, contentEl) {
 			|| sel.focusNode == contentEl
 		) return
 
-		const range = sel.getRangeAt(0)
+		const range = safeGetRangeAt(0)
+		if (!range) return
 
 		let parentEl = sel.anchorNode
 		while (!isDirectChild(contentEl, parentEl)) parentEl = parentEl.parentElement
@@ -242,7 +256,8 @@ function hasContent (element) {
 	if (element.tagName === "IMG"
 		|| element.tagName === "AUDIO"
 		|| element.tagName === "VIDEO"
-		|| element.tagName === "IFRAME") return true
+		|| element.tagName === "IFRAME"
+		|| element.tagName === "BR") return true
 	return false
 }
 
@@ -264,13 +279,9 @@ function cleanContent (contentEl) {
 				child.tagName = "P"
 			}
 		} else if (child.nodeType === Node.TEXT_NODE) {
-			const wasSelected = sel.getRangeAt(0).intersectsNode(child)
-
 			const el = document.createElement("p")
-			el.appendChild(child)
 			contentEl.insertBefore(el, child.nextSibling)
-
+			el.appendChild(child)
-			if (wasSelected) sel.collapse(el, child.data.length)
 		}
 	}
 }
@@ -319,7 +330,8 @@ function cleanNode (node, contentEl) {
 				child.parentNode.removeChild(child.nextSibling)
 			}
 		} else if (child.nodeType === Node.ELEMENT_NODE) {
-			if (!hasContent(child) && !window.getSelection().getRangeAt(0).intersectsNode(child))
+			const range = safeGetRangeAt(0)
+			if (!hasContent(child) && (!range || !range.intersectsNode(child)))
 				child.parentNode.removeChild(child)
 
 			for (const mark of Object.values(marks)) {
@@ -433,16 +445,6 @@ function setupEditor (editorEl) {
 
 	const contentEl = editorEl.querySelector(".editor-content")
 
-	contentEl.addEventListener("keydown", event => {
-		if (event.keyCode === 32) { // Espacio
-			event.preventDefault()
-			const sel = window.getSelection()
-			const range = sel.getRangeAt(0)
-			range.insertNode(document.createTextNode("\xa0"))
-			cleanContent(contentEl)
-			range.collapse()
-		}
-	})
 	contentEl.addEventListener("paste", event => {
 		editorEl.querySelector(".editor-aviso-word").style.display = "block"
 	})