From dff98312287c6461ebf54f553766f17ed6bf6be1 Mon Sep 17 00:00:00 2001
From: Pierre HUBERT <pierre.git@communiquons.org>
Date: Thu, 10 Jan 2019 16:28:59 +0100
Subject: [PATCH] Improved Sceditor integration

---
 .../js-bbcode-parser/bbcode-config.js         |  4 +-
 assets/css/common/global.css                  |  7 ++++
 assets/css/dark_theme.css                     |  7 ++++
 assets/js/common/utils.js                     | 40 +++++++++++++++++++
 assets/js/components/posts/edit.js            |  3 +-
 assets/js/components/posts/form.js            | 10 ++---
 6 files changed, 61 insertions(+), 10 deletions(-)

diff --git a/assets/3rdparty/js-bbcode-parser/bbcode-config.js b/assets/3rdparty/js-bbcode-parser/bbcode-config.js
index 82c072d8..cc951805 100644
--- a/assets/3rdparty/js-bbcode-parser/bbcode-config.js
+++ b/assets/3rdparty/js-bbcode-parser/bbcode-config.js
@@ -92,10 +92,10 @@ var parserTags = {
 	},
 	'quote': {
 		openTag: function(params,content) {
-			return '<q>';
+			return '<blockquote>';
 		},
 		closeTag: function(params,content) {
-			return '</q>';
+			return '</blockquote>';
 		}
 	},
 	's': {
diff --git a/assets/css/common/global.css b/assets/css/common/global.css
index 0bc5b947..6e646d38 100644
--- a/assets/css/common/global.css
+++ b/assets/css/common/global.css
@@ -23,4 +23,11 @@ a {
 
 .a:focus, .a:hover {
     color: #72afd2;
+}
+
+/**
+ * Sceditor iframe
+ */
+.sceditor-iframe-body {
+    padding: 5px;
 }
\ No newline at end of file
diff --git a/assets/css/dark_theme.css b/assets/css/dark_theme.css
index f477d8e0..d0aa3e11 100644
--- a/assets/css/dark_theme.css
+++ b/assets/css/dark_theme.css
@@ -33,6 +33,13 @@ p, h1, h2, h3, h4, h5, h6 {
     background-color: var(--black3);
 }
 
+/**
+ * Sceditor body
+ */
+.sceditor-iframe-body {
+    background-color: var(--black5);
+    color: var(--white);
+}
 
 /**
 * Buttons
diff --git a/assets/js/common/utils.js b/assets/js/common/utils.js
index c29150d4..cdca21a1 100644
--- a/assets/js/common/utils.js
+++ b/assets/js/common/utils.js
@@ -638,4 +638,44 @@ function removeJavascriptEventsFromHTML(html){
 	}
 
 	return html;
+}
+
+/**
+ * Get and return the DOM of a specified iframe
+ * 
+ * @param {HTMLIFrameElement} iframe The iframe to process
+ * @return {HTMLDocument} DOM of the iframe 
+ */
+function GetIframeDOM(iframe){
+	return iframe.contentWindow
+	 ? iframe.contentWindow.document
+	 : iframe.contentDocument;
+}
+
+/**
+ * Initialize styles for a sceditor textarea
+ * 
+ * @param {HTMLTextAreaElement} textarea Target textarea element that
+ * have sceditor initialized
+ */
+function ApplySceditorStyle(textarea){
+
+	//Get iframe DOM
+	var iframeDOM = GetIframeDOM(textarea.parentNode.getElementsByTagName("iframe")[0]);
+	
+	//Apply stylesheets
+	document.querySelectorAll("link[rel='stylesheet']").forEach(function(entry){
+
+		//Skip the entry if it is disabled
+		if(entry.disabled)
+			return;
+
+		var elem = iframeDOM.createElement("link");
+		elem.rel = "stylesheet";
+		elem.href = entry.href;
+		iframeDOM.head.appendChild(elem);
+	});
+
+	//Apply new styles to body
+	iframeDOM.body.className += " sceditor-iframe-body";
 }
\ No newline at end of file
diff --git a/assets/js/components/posts/edit.js b/assets/js/components/posts/edit.js
index 574ffc3b..0b4b3c60 100644
--- a/assets/js/components/posts/edit.js
+++ b/assets/js/components/posts/edit.js
@@ -118,10 +118,11 @@ ComunicWeb.components.posts.edit = {
 			height: "200px",
 			width: "100%",
 			icons: "material",
-			style: ComunicWeb.components.posts.form.sceditor_stylsheet,
 			toolbarExclude: "youtube,image,size,link,print,mail,emoticon,maximize"
 		});
 
+		ApplySceditorStyle(editorTextarea);
+
 		//Create function to close modal
 		var closeModal = function(){
 			$(modal).modal('hide');
diff --git a/assets/js/components/posts/form.js b/assets/js/components/posts/form.js
index 39741e37..90794c4f 100644
--- a/assets/js/components/posts/form.js
+++ b/assets/js/components/posts/form.js
@@ -6,11 +6,6 @@
 
 ComunicWeb.components.posts.form = {
 
-	/**
-	 * SCEDITOR common options
-	 */
-	sceditor_stylsheet: "data:text/css;raw, body {font-family: 'Helvetica Neue',Helvetica,Arial,sans-serif;font-size: 14px;line-height: 1.42857143;}",
-
 	/**
 	 * Display post creation form
 	 * 
@@ -69,11 +64,12 @@ ComunicWeb.components.posts.form = {
 			'bulletlist,orderedlist,table,code,quote,source',
 			emoticonsEnabled: false,
 			icons: "material",
-			//Hack : style a little iframe
-			style: this.sceditor_stylsheet,
 			toolbarContainer: inputMessageToolbarTarget
 		});
 
+		//Apply all stylesheets to the editor iframe
+		ApplySceditorStyle(inputMessageTextarea);
+
 		//Enable emojies picker
 		ComunicWeb.components.emoji.picker.addDetachedPicker(newPostMessageContener, function(emojie){