changeset 44:48c153a1a6cf

fix grip
author Franklin Schmidt <fschmidt@gmail.com>
date Tue, 30 Aug 2022 01:52:16 -0600
parents ab852c9f04c3
children bc1bce78276d
files src/icons/material/resize-bottom-right.png src/sceditor.js src/themes/default.css
diffstat 3 files changed, 18 insertions(+), 21 deletions(-) [+]
line wrap: on
line diff
Binary file src/icons/material/resize-bottom-right.png has changed
--- a/src/sceditor.js	Mon Aug 29 23:33:11 2022 -0600
+++ b/src/sceditor.js	Tue Aug 30 01:52:16 2022 -0600
@@ -1686,7 +1686,11 @@
 		 *
 		 * @type {Object}
 		 */
-		dropDownCss: { }
+		dropDownCss: { },
+
+		//gripIcon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M14.656 5.156l-10 10 .688.688 10-10-.688-.688zm0 3l-7 7 .688.688 7-7-.688-.688zm0 3l-4 4 .688.688 4-4-.688-.688z"></svg>',
+		//gripIcon: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22,22H20V20H22V22M22,18H20V16H22V18M18,22H16V20H18V22M18,18H16V16H18V18M14,22H12V20H14V22M22,14H20V12H22V14Z"></svg>',
+		gripIcon: '<img src="' + baseUrl + 'icons/material/resize-bottom-right.png">',
 	};
 
 	// Must start with a valid scheme
@@ -4762,10 +4766,11 @@
 
 					let shortcut = command.shortcut;
 					let icon = command.icon;
-					let button   = _tmpl('toolbarButton', {
+					let button = _tmpl( 'toolbarButton', {
 						name: commandName,
 						icon: icon || '',
-					}, true).firstChild;
+					} );
+					button = parseHTML(button).firstChild;
 					button._sceTxtMode = !!command.txtExec;
 					button._sceWysiwygMode = !!command.exec;
 					toggleClass(button, 'disabled', !command.exec);
@@ -4828,9 +4833,6 @@
 		initResize = function () {
 			var	minHeight, maxHeight, minWidth, maxWidth,
 				mouseMoveFunc, mouseUpFunc,
-				grip        = createElement('div', {
-					className: 'sceditor-grip'
-				}),
 				// Cover is used to cover the editor iframe so document
 				// still gets mouse move events
 				cover       = createElement('div', {
@@ -4912,6 +4914,9 @@
 				e.preventDefault();
 			};
 
+			let grip = '<div class="sceditor-grip">' + options.gripIcon + '</div>';
+			grip = parseHTML(grip).firstChild;
+
 			appendChild(editorContainer, grip);
 			appendChild(editorContainer, cover);
 			hide(cover);
@@ -5071,18 +5076,13 @@
 		 * @return {this}
 		 */
 		base.rtl = function (rtl) {
-			var dir = rtl ? 'rtl' : 'ltr';
-
 			if (typeof rtl !== 'boolean') {
 				return attr(sourceEditor, 'dir') === 'rtl';
 			}
-
+			let dir = rtl ? 'rtl' : 'ltr';
 			attr(wysiwygBody, 'dir', dir);
 			attr(sourceEditor, 'dir', dir);
-
-			removeClass(editorContainer, 'rtl');
-			removeClass(editorContainer, 'ltr');
-			addClass(editorContainer, dir);
+			attr(editorContainer, 'dir', dir);
 		};
 
 		/**
--- a/src/themes/default.css	Mon Aug 29 23:33:11 2022 -0600
+++ b/src/themes/default.css	Tue Aug 30 01:52:16 2022 -0600
@@ -102,6 +102,9 @@
 	z-index: 3;
 	line-height: 0;
 }
+div.sceditor-grip img {
+	width: 100%;
+}
 .sceditor-maximize {
 	position: fixed;
 	top: 0;
@@ -265,7 +268,6 @@
 	background: #f7f7f7;
 	border-bottom: 1px solid #c0c0c0;
 	line-height: 0;
-	text-align: left;
 	user-select: none;
 	border-radius: 3px 3px 0 0;
 	background-clip: padding-box;
@@ -307,13 +309,8 @@
 	opacity: 0.3;
 }
 
-.rtl div.sceditor-toolbar {
-	text-align: right;
-}
-.rtl .sceditor-toolbar button {
-	float: right;
-}
-.rtl div.sceditor-grip {
+[dir="rtl"] div.sceditor-grip {
 	right: auto;
 	left: 0;
+	transform: scaleX(-1);
 }