Merge pull request #992 from ajaxorg/bold_fonts

Allow bold fonts
This commit is contained in:
Mostafa Eweda 2012-10-03 02:51:55 -07:00
commit c91f42f813
6 changed files with 34 additions and 18 deletions

View file

@ -1,7 +1,3 @@
/*PACKAGE
@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono);
PACKAGE*/
html {
height: 100%;
width: 100%;

View file

@ -16,10 +16,12 @@
<!--DEVEL-->
<link rel="stylesheet" href="demo/kitchen-sink/styles.css" type="text/css" media="screen" charset="utf-8">
<script src="http://use.edgefonts.net/source-code-pro.js"></script>
<!--DEVEL-->
<!--PACKAGE
<link rel="stylesheet" href="kitchen-sink/styles.css" type="text/css" media="screen" charset="utf-8">
<script src="http://use.edgefonts.net/source-code-pro.js"></script>
PACKAGE-->
</head>
<body>

View file

@ -1,7 +1,7 @@
.ace_editor {
position: absolute;
overflow: hidden;
font-family: 'Monaco', 'Menlo', 'Ubuntu Mono', 'Droid Sans Mono', 'Consolas', monospace;
font-family: 'Menlo', 'Monaco', 'Ubuntu Mono', 'Consolas', 'source-code-pro', monospace;
font-size: 12px;
}
@ -345,6 +345,10 @@
font-weight: bold;
}
.ace_nobold .ace_bold {
font-weight: normal;
}
.ace_italic {
font-style: italic;
}

View file

@ -42,7 +42,8 @@ var Text = function(parentEl) {
this.element.className = "ace_layer ace_text-layer";
parentEl.appendChild(this.element);
this.$characterSize = this.$measureSizes() || {width: 0, height: 0};
this.$characterSize = {width: 0, height: 0};
this.checkForSizeChanges();
this.$pollSizeChanges();
};
@ -72,7 +73,11 @@ var Text = function(parentEl) {
this.checkForSizeChanges = function() {
var size = this.$measureSizes();
if (size && (this.$characterSize.width !== size.width || this.$characterSize.height !== size.height)) {
this.$measureNode.style.fontWeight = "bold";
var boldSize = this.$measureSizes();
this.$measureNode.style.fontWeight = "";
this.$characterSize = size;
this.allowBoldFonts = boldSize && boldSize.width === size.width && boldSize.height === size.height;
this._emit("changeCharacterSize", {data: size});
}
};

View file

@ -87,6 +87,11 @@
box-shadow: 0 0 3px 0px white;
border-radius: 2px;
}
/* bold keywords cause cursor issues for some fonts */
/* this disables bold style for editor and keeps for static highlighter */
.ace-github.ace_nobold .ace_line > span {
font-weight: normal !important;
}
.ace-github .ace_marker-layer .ace_step {
background: rgb(252, 255, 0);

View file

@ -103,9 +103,6 @@ var VirtualRenderer = function(container, theme) {
this.$markerFront = new MarkerLayer(this.content);
this.characterWidth = textLayer.getCharacterWidth();
this.lineHeight = textLayer.getLineHeight();
this.$cursorLayer = new CursorLayer(this.content);
this.$cursorPadding = 8;
@ -136,12 +133,8 @@ var VirtualRenderer = function(container, theme) {
};
this.$textLayer.addEventListener("changeCharacterSize", function() {
_self.characterWidth = textLayer.getCharacterWidth();
_self.lineHeight = textLayer.getLineHeight();
_self.$updatePrintMargin();
_self.updateCharacterSize();
_self.onResize(true);
_self.$loop.schedule(_self.CHANGE_FULL);
});
this.$size = {
@ -172,7 +165,7 @@ var VirtualRenderer = function(container, theme) {
this.$loop.schedule(this.CHANGE_FULL);
this.setPadding(4);
this.$updatePrintMargin();
this.updateCharacterSize();
};
(function() {
@ -191,6 +184,17 @@ var VirtualRenderer = function(container, theme) {
this.CHANGE_H_SCROLL = 1024;
oop.implement(this, EventEmitter);
this.updateCharacterSize = function() {
if (this.$textLayer.allowBoldFonts != this.$allowBoldFonts) {
this.$allowBoldFonts = this.$textLayer.allowBoldFonts;
this.setStyle("ace_nobold", !this.$allowBoldFonts);
}
this.characterWidth = this.$textLayer.getCharacterWidth();
this.lineHeight = this.$textLayer.getLineHeight();
this.$updatePrintMargin();
};
/**
* VirtualRenderer.setSession(session)
@ -1362,8 +1366,8 @@ var VirtualRenderer = function(container, theme) {
*
* [Adds a new class, `style`, to the editor.]{: #VirtualRenderer.setStyle}
**/
this.setStyle = function setStyle(style) {
dom.addCssClass(this.container, style);
this.setStyle = function setStyle(style, include) {
dom.setCssClass(this.container, style, include != false);
};
/**
@ -1373,7 +1377,7 @@ var VirtualRenderer = function(container, theme) {
* [Removes the class `style` from the editor.]{: #VirtualRenderer.unsetStyle}
**/
this.unsetStyle = function unsetStyle(style) {
dom.removeCssClass(this.container, style);
dom.removeCssClass(this.container, style);
};
/**