How to enable or disable shortcut compliance compliance
3 answers
I would suggest hiding it with CSS. The only drawback is that this will globally disable the highlighting of all brackets, not just HTML tags.
.ace_editor .ace_marker-layer .ace_bracket { display: none }
See a working demo below:
var editor = ace.edit("editor");
editor.setTheme("ace/theme/dreamweaver");
editor.getSession().setMode("ace/mode/html");
#editor {
position: absolute !important;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
#editor .ace_marker-layer .ace_bracket { display: none }
<script src="https://cdn.jsdelivr.net/g/ace@1.2.3(min/ace.js+min/mode-html.js+min/theme-dreamweaver.js)" type="text/javascript"></script>
<div id="editor"><html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<style type="text/css" media="screen">
html, body {
height: 100%;
}
</style>
</head>
</html></div>
+3
source to share
Highlighting matching tags and parentheses is always allowed, so an option should be added to not highlight here https://github.com/ajaxorg/ace/blob/master/lib/ace/editor.js#L535 .
0
source to share
Here's one way to manually disable it and then enable it again:
function toggleMatchingTagStyle() {
if (editor.$highlightTagPending == true) {
editor.$highlightTagPending = false;
editor.$highlightPending = false;
}
else {
session.removeMarker(session.$tagHighlight);
session.$tagHighlight = null;
session.removeMarker(session.$bracketHighlight);
session.$bracketHighlight = null;
editor.$highlightTagPending = true;
editor.$highlightPending = true;
}
}
And here is a rough patch that I think will work with editor.js to enable or disable this feature:
for old style set getter functions
this.setHighlightMatchingTags = function(shouldHighlight) {
this.setOption("highlightMatchingTags", shouldHighlight);
};
this.getHighlightMatchingTags = function() {
return this.getOption("highlightMatchingTags");
};
this.setHighlightMatchingBrackets = function(shouldHighlight) {
this.setOption("highlightMatchingBrackets", shouldHighlight);
};
this.getHighlightMatchingBrackets = function() {
return this.getOption("highlightMatchingBrackets");
};
for setOption () in editor.js # L2624 add
highlightMatchingTags: {
set: function(shouldHighlight) {this.$onSelectionChange();},
initialValue: true
},
highlightMatchingBrackets: {
set: function(shouldHighlight) {this.$onSelectionChange();},
initialValue: true
},
Change this (line 505):
this.$highlightBrackets = function() {
For this:
this.$highlightBrackets = function() {
if (!this.$highlightMatchingBrackets) return;
Change this (line 534):
this.$highlightTags = function() {
For this:
this.$highlightTags = function() {
if (!this.$highlightMatchingTags) return;
0
source to share