new boolean property applyDefaultFont for rtf editor and using it in mail compose

making sure it applyDefaultFont method gets always called in compose

api/js/etemplate/et2_widget_htmlarea.ts

@@ -100,6 +100,12 @@ export class et2_htmlarea extends et2_editableWidget implements et2_IResizeable
 			'type': 'string',
 			'default': 'floating',
 			'description': 'It allows to extend the toolbar to accommodate the overflowing toolbar buttons. {floating, sliding, scrolling, wrap}'
+		},
+		applyDefaultFont: {
+			name: 'apply default font and size',
+			type: 'boolean',
+			default: false,
+			description: 'Add default font and size as style attribute to the markup. Also ensures all non-block elements are wrapped in p.'
 		}
 	};
 
@@ -516,7 +522,10 @@ export class et2_htmlarea extends et2_editableWidget implements et2_IResizeable
 			this.editor.setContent(_value);
 
 			// need to defer a little, so TinyMCE does its modifications we want to counter
-			window.setTimeout(() => this.wrapTextNodes(), 1);
+			if (this.options.applyDefaultFont)
+			{
+				window.setTimeout(() => this.wrapTextNodes(), 10);
+			}
 		}
 		else
 		{
@@ -532,22 +541,16 @@ export class et2_htmlarea extends et2_editableWidget implements et2_IResizeable
 		this.value = _value;
 	}
 
-	/**
-	 * Overwrite isValid to first "fix" the TinyMCE content, see wrapTextNodes
-	 *
-	 * @param _values
-	 */
-	isValid(_messages)
-	{
-		this.wrapTextNodes();
-
-		return super.isValid(_messages);
-	}
-
 	getValue()
 	{
 		if (this.editor)
 		{
+			// are we called by etemplate2.getValues() (has a closure result)
+			// not always setting it, as getValue() is called a lot, e.g. to test input is dirty
+			if (this.options.applyDefaultFont && typeof result !== 'undefined')
+			{
+				this.applyDefaultFont();
+			}
 			return this.editor.getContent();
 		}
 		return this.options.readonly ? this.value : this.htmlNode.val();

mail/js/app.js

@@ -5466,9 +5466,6 @@ app.classes.mail = AppJS.extend(
 			this.compose_submitAction(false);
 		}
 
-		// apply default font and -size before submitting to server for sending
-		this.et2?.getWidgetById('mail_htmltext')?.applyDefaultFont();
-
 		return false;
 	},
 

mail/templates/default/compose.xet

@@ -139,7 +139,8 @@
                 </et2-hbox>
             </et2-vbox>
             <et2-hbox disabled="@is_plain" class="mailComposeBody mailComposeHtmlContainer">
-                <htmlarea name="mail_htmltext" id="mail_htmltext" statusbar="false" menubar="false" toolbar="@html_toolbar" imageUpload="link_to" expand_toolbar="true" width="100%" resize_ratio="0"/>
+                <htmlarea name="mail_htmltext" id="mail_htmltext" statusbar="false" menubar="false" toolbar="@html_toolbar"
+					imageUpload="link_to" expand_toolbar="true" width="100%" resize_ratio="0" applyDefaultFont="true"/>
             </et2-hbox>
             <et2-hbox disabled="@is_html" class="mailComposeBody mailComposeTextContainer">
                 <et2-textarea span="all" name="mail_plaintext" id="mail_plaintext" noLang="1" resizeRatio="0"></et2-textarea>

mail/templates/mobile/compose.xet

@@ -84,7 +84,8 @@
 		</et2-vbox>
 		<et2-vbox  class="mailComposeBodySection" width="99%">
 			<et2-hbox  disabled="@is_plain" class="mailComposeBody mailComposeHtmlContainer">
-				<htmlarea span="all" name="mail_htmltext" id="mail_htmltext" statusbar="false" menubar="false" mode="simple" imageUpload="link_to"  height="478px" width="100%" resize_ratio="0"/>
+				<htmlarea span="all" name="mail_htmltext" id="mail_htmltext" statusbar="false" menubar="false" mode="simple"
+					imageUpload="link_to"  height="478px" width="100%" resize_ratio="0" applyDefaultFont="true"/>
 			</et2-hbox>
 			<et2-hbox  disabled="@is_html" class="mailComposeBody mailComposeTextContainer">
 				<et2-textarea  rows="40" cols="120" width="100%" span="all" height="100%" name="mail_plaintext" id="mail_plaintext" noLang="1" resizeRatio="0"></et2-textarea>