From 1557004dfacc0680569d52e855cec40220461965 Mon Sep 17 00:00:00 2001 From: DanyaPostfactum Date: Tue, 2 Oct 2012 04:11:56 +1000 Subject: [PATCH] Add smoothBlinking option to cursor --- lib/ace/css/editor.css | 12 ++++++++++++ lib/ace/layer/cursor.js | 25 ++++++++++++++++++++++--- 2 files changed, 34 insertions(+), 3 deletions(-) diff --git a/lib/ace/css/editor.css b/lib/ace/css/editor.css index c3a7fc8e..2603efcd 100644 --- a/lib/ace/css/editor.css +++ b/lib/ace/css/editor.css @@ -152,6 +152,18 @@ opacity: 0.2; } +.ace_smooth-blinking .ace_cursor { + -moz-transition: opacity 0.18s; + -webkit-transition: opacity 0.18s; + -o-transition: opacity 0.18s; + -ms-transition: opacity 0.18s; + transition: opacity 0.18s; +} + +.ace_cursor[style*="opacity: 0"]{ + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; +} + .ace_editor.ace_multiselect .ace_cursor { border-left-width: 1px; } diff --git a/lib/ace/layer/cursor.js b/lib/ace/layer/cursor.js index 710958b8..8bcc5423 100644 --- a/lib/ace/layer/cursor.js +++ b/lib/ace/layer/cursor.js @@ -41,6 +41,7 @@ var Cursor = function(parentEl) { this.isVisible = false; this.isBlinking = true; this.blinkInterval = 1000; + this.smoothBlinking = false; this.cursors = []; this.cursor = this.addCursor(); @@ -71,6 +72,17 @@ var Cursor = function(parentEl) { } }; + this.setSmoothBlinking = function(smoothBlinking) { + if (smoothBlinking != this.smoothBlinking) { + this.smoothBlinking = smoothBlinking; + if (smoothBlinking) + dom.addCssClass(this.element, "ace_smooth-blinking"); + else + dom.removeCssClass(this.element, "ace_smooth-blinking"); + this.resetTimer(); + } + }; + this.addCursor = function() { var el = dom.createElement("div"); var className = "ace_cursor"; @@ -110,23 +122,30 @@ var Cursor = function(parentEl) { this.resetTimer = function() { clearInterval(this.intervalId); clearTimeout(this.timeoutId); + if (this.smoothBlinking) + dom.removeCssClass(this.element, "ace_smooth-blinking"); for (var i = this.cursors.length; i--; ) - this.cursors[i].style.visibility = ""; + this.cursors[i].style.opacity = ""; if (!this.isBlinking || !this.blinkInterval || !this.isVisible) return; + if (this.smoothBlinking) + setTimeout(function(){ + dom.addCssClass(this.element, "ace_smooth-blinking"); + }.bind(this)); + var blink = function(){ this.timeoutId = setTimeout(function() { for (var i = this.cursors.length; i--; ) { - this.cursors[i].style.visibility = "hidden"; + this.cursors[i].style.opacity = 0; } }.bind(this), 0.6 * this.blinkInterval); }.bind(this); this.intervalId = setInterval(function() { for (var i = this.cursors.length; i--; ) { - this.cursors[i].style.visibility = ""; + this.cursors[i].style.opacity = ""; } blink(); }.bind(this), this.blinkInterval);