colorSyntax command resolve #291

nhn · Jan 2, 2020 · 4cdb904 · 4cdb904
1 parent dc94eab
commit 4cdb904
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 1 deletion.
diff --git a/apps/core/src/js/extensions/colorSyntax.js b/apps/core/src/js/extensions/colorSyntax.js
@@ -22,11 +22,32 @@ extManager.defineExtension('colorSyntax', function(editor) {
                 color = changeDecColorToHex(color);
             }
 
-            return '{color:' + color + '}' + text + '{color}';
+            return makeMarkdownColorSyntax(text, color);
         });
     });
+
+    editor.addCommand('markdown', {
+        name: 'color',
+        exec: function(mde, color) {
+            var cm = mde.getEditor();
+            cm.replaceSelection(makeMarkdownColorSyntax(cm.getSelection(), color));
+            mde.focus();
+        }
+    });
+
+    editor.addCommand('wysiwyg', {
+        name: 'color',
+        exec: function(wwe, color) {
+            wwe.getEditor().setTextColour(color);
+            wwe.focus();
+        }
+    });
 });
 
+function makeMarkdownColorSyntax(text, color) {
+    return '{color:' + color + '}' + text + '{color}';
+}
+
 function changeDecColorToHex(color) {
     return color.replace(decimalColorRx, function(colorValue, r, g, b) {
         r = parseInt(r, 10);

diff --git a/apps/core/test/extensions/colorSyntax.spec.js b/apps/core/test/extensions/colorSyntax.spec.js
@@ -69,4 +69,36 @@ describe('colorSyntax', function() {
             expect(actual).toEqual(expected);
         });
     });
+
+    describe('commands', function() {
+        it('add color in markdown', function() {
+            ned.setValue('text');
+            ned.getCodeMirror().execCommand('selectAll');
+            ned.exec('color', '#f0f');
+
+            expect(ned.getValue()).toEqual('{color:#f0f}text{color}');
+        });
+
+        it('add color in wysiwyg', function() {
+            var sq, $body, selection, $span;
+
+            ned.changeMode('wysiwyg');
+
+            sq = ned.getSquire();
+            $body = ned.wwEditor.get$Body();
+
+            sq.setHTML('text');
+
+            selection = sq.getSelection().cloneRange();
+            selection.selectNodeContents($body.find('div')[0].childNodes[0]);
+            sq.setSelection(selection);
+
+            ned.exec('color', '#f0f');
+
+            $span = ned.wwEditor.get$Body().find('span');
+
+            expect($span.hasClass('colour')).toBe(true);
+            expect($span.css('color')).toEqual('rgb(255, 0, 255)');
+        });
+    });
 });