|
1 | 1 | /* |
2 | 2 |
|
3 | 3 | codeit.js |
4 | | - v3.1.4 |
5 | | - MIT License |
6 | | -
|
| 4 | + 3.1.5 |
| 5 | + |
7 | 6 | https://codeit.codes |
8 | 7 |
|
9 | 8 | */ |
@@ -733,97 +732,91 @@ class CodeitElement extends HTMLElement { |
733 | 732 | function handleSelfClosingCharacters(event) { |
734 | 733 |
|
735 | 734 | const cursor = cd.dropper.cursor(); |
736 | | - const inStringOrComment = (cursor.in('string') || cursor.in('comment')); |
737 | 735 |
|
738 | | - // if cursor is not in string or comment |
739 | | - if (!inStringOrComment) { |
| 736 | + // join brackets and quotation marks |
| 737 | + // to get chars to autocomplete |
| 738 | + const open = cd.options.openBrackets.join('') + cd.options.quot.join(''); |
| 739 | + const close = cd.options.closeBrackets.join('') + cd.options.quot.join(''); |
740 | 740 |
|
741 | | - // join brackets and quotation marks |
742 | | - // to get chars to autocomplete |
743 | | - const open = cd.options.openBrackets.join('') + cd.options.quot.join(''); |
744 | | - const close = cd.options.closeBrackets.join('') + cd.options.quot.join(''); |
| 741 | + // get code before and after cursor |
| 742 | + const codeAfter = cd.afterCursor(); |
| 743 | + const codeBefore = cd.beforeCursor(); |
745 | 744 |
|
746 | | - // get code before and after cursor |
747 | | - const codeAfter = cd.afterCursor(); |
748 | | - const codeBefore = cd.beforeCursor(); |
| 745 | + const charBefore = codeBefore.slice(-1); |
| 746 | + const charAfter = codeAfter.charAt(0); |
749 | 747 |
|
750 | | - const charBefore = codeBefore.slice(-1); |
751 | | - const charAfter = codeAfter.charAt(0); |
| 748 | + // check if typed an opening or closing char |
| 749 | + const typedOpeningChar = open.includes(event.key); |
| 750 | + const typedClosingChar = close.includes(event.key); |
752 | 751 |
|
753 | | - // check if typed an opening or closing char |
754 | | - const typedOpeningChar = open.includes(event.key); |
755 | | - const typedClosingChar = close.includes(event.key); |
| 752 | + // closing char is next to cursor if |
| 753 | + // the chars before and after the cursor are |
| 754 | + // matching opening and closing chars |
| 755 | + const closingCharNextToCursor = (charBefore === open[close.indexOf(event.key)] |
| 756 | + && charAfter === event.key); |
756 | 757 |
|
757 | | - // closing char is next to cursor if |
758 | | - // the chars before and after the cursor are |
759 | | - // matching opening and closing chars |
760 | | - const closingCharNextToCursor = (charBefore === open[close.indexOf(event.key)] |
761 | | - && charAfter === event.key); |
| 758 | + // if typed opening char |
| 759 | + if (typedOpeningChar) { |
762 | 760 |
|
763 | | - // if typed opening char |
764 | | - if (typedOpeningChar) { |
| 761 | + // if selection exists |
| 762 | + if (!cursor.collapsed) { |
765 | 763 |
|
766 | | - // if selection exists |
767 | | - if (!cursor.collapsed) { |
| 764 | + // prevent default behavior |
| 765 | + event.preventDefault(); |
| 766 | + |
| 767 | + // get the text to wrap |
| 768 | + const textToWrap = window.getSelection().toString(); |
768 | 769 |
|
769 | | - // prevent default behavior |
770 | | - event.preventDefault(); |
| 770 | + // wrap the text with matching opening and closing chars |
| 771 | + const wrappedText = event.key + textToWrap + close[open.indexOf(event.key)]; |
771 | 772 |
|
772 | | - // get the text to wrap |
773 | | - const textToWrap = window.getSelection().toString(); |
| 773 | + // delete current selection |
| 774 | + cd.deleteCurrentSelection(); |
774 | 775 |
|
775 | | - // wrap the text with matching opening and closing chars |
776 | | - const wrappedText = event.key + textToWrap + close[open.indexOf(event.key)]; |
| 776 | + // insert wrapped text |
| 777 | + cd.insert(wrappedText, { moveToEnd: false }); |
| 778 | + |
| 779 | + // get caret pos in text |
| 780 | + const pos = cd.getSelection(); |
| 781 | + |
| 782 | + // restore pos in text |
| 783 | + cd.setSelection(pos.start, (pos.start + wrappedText.length)); |
777 | 784 |
|
778 | | - // delete current selection |
779 | | - cd.deleteCurrentSelection(); |
| 785 | + } else { |
| 786 | + |
| 787 | + // get caret pos in text |
| 788 | + const pos = cd.getSelection(); |
780 | 789 |
|
781 | | - // insert wrapped text |
782 | | - cd.insert(wrappedText, { moveToEnd: false }); |
| 790 | + // if cursor is on last line |
| 791 | + if (pos.start === cd.textContent.length) { |
783 | 792 |
|
784 | | - // get caret pos in text |
785 | | - const pos = cd.getSelection(); |
| 793 | + // insert newline |
| 794 | + cd.insert((close[open.indexOf(event.key)] + '\n'), { moveToEnd: false }); |
786 | 795 |
|
787 | | - // restore pos in text |
788 | | - cd.setSelection(pos.start, (pos.start + wrappedText.length)); |
789 | | - |
790 | 796 | } else { |
791 | | - |
792 | | - // get caret pos in text |
793 | | - const pos = cd.getSelection(); |
794 | | - |
795 | | - // if cursor is on last line |
796 | | - if (pos.start === cd.textContent.length) { |
797 | | - |
798 | | - // insert newline |
799 | | - cd.insert((close[open.indexOf(event.key)] + '\n'), { moveToEnd: false }); |
800 | | - |
801 | | - } else { |
802 | | - |
803 | | - // insert matching closing char |
804 | | - cd.insert(close[open.indexOf(event.key)], { moveToEnd: false }); |
805 | | - |
806 | | - } |
807 | 797 |
|
| 798 | + // insert matching closing char |
| 799 | + cd.insert(close[open.indexOf(event.key)], { moveToEnd: false }); |
| 800 | + |
808 | 801 | } |
809 | 802 |
|
810 | 803 | } |
811 | 804 |
|
812 | | - // if typed closing char but closing char |
813 | | - // is already next to cursor |
814 | | - if (typedClosingChar && closingCharNextToCursor) { |
| 805 | + } |
815 | 806 |
|
816 | | - // prevent default behavior |
817 | | - event.preventDefault(); |
| 807 | + // if typed closing char but closing char |
| 808 | + // is already next to cursor |
| 809 | + if (typedClosingChar && closingCharNextToCursor) { |
818 | 810 |
|
819 | | - // get caret pos in text |
820 | | - const pos = cd.getSelection(); |
| 811 | + // prevent default behavior |
| 812 | + event.preventDefault(); |
821 | 813 |
|
822 | | - // move caret one char right |
823 | | - pos.start++; |
824 | | - cd.setSelection(pos.start); |
| 814 | + // get caret pos in text |
| 815 | + const pos = cd.getSelection(); |
825 | 816 |
|
826 | | - } |
| 817 | + // move caret one char right |
| 818 | + pos.start++; |
| 819 | + cd.setSelection(pos.start); |
827 | 820 |
|
828 | 821 | } |
829 | 822 |
|
|
0 commit comments