From 2636e5de5fa2aa34f28253124bbe3ce91d246fe3 Mon Sep 17 00:00:00 2001 From: takapa Date: Sun, 12 Oct 2014 01:20:27 +0100 Subject: [PATCH] Improve tooltips Allow tooltips in div element (currently tooltips only allow items in pre element which is tricky to format). Also fix wrapping, remove gradient fill, and introduce a maximum width of 500px by default. --- lib/ace/autocomplete.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/lib/ace/autocomplete.js b/lib/ace/autocomplete.js index b4bac72b..f4ef6547 100644 --- a/lib/ace/autocomplete.js +++ b/lib/ace/autocomplete.js @@ -352,12 +352,13 @@ var Autocomplete = function() { this.showDocTooltip = function(item) { if (!this.tooltipNode) { - this.tooltipNode = dom.createElement("pre"); + this.tooltipNode = item.docHTML ? dom.createElement("div") : dom.createElement("pre"); this.tooltipNode.className = "ace_tooltip ace_doc-tooltip"; this.tooltipNode.style.margin = 0; this.tooltipNode.style.pointerEvents = "auto"; this.tooltipNode.tabIndex = -1; this.tooltipNode.onblur = this.blurListener.bind(this); + } var tooltipNode = this.tooltipNode; @@ -366,14 +367,15 @@ var Autocomplete = function() { } else if (item.docText) { tooltipNode.textContent = item.docText; } - + if (!tooltipNode.parentNode) document.body.appendChild(tooltipNode); var popup = this.popup; var rect = popup.container.getBoundingClientRect(); tooltipNode.style.top = popup.container.style.top; tooltipNode.style.bottom = popup.container.style.bottom; - + tooltipNode.style.backgroundImage = "none"; + tooltipNode.style.backgroundColor = "#FFFFEE"; if (window.innerWidth - rect.right < 320) { tooltipNode.style.right = window.innerWidth - rect.left + "px"; tooltipNode.style.left = ""; @@ -381,8 +383,11 @@ var Autocomplete = function() { tooltipNode.style.left = (rect.right + 1) + "px"; tooltipNode.style.right = ""; } - // tooltipNode.style.height = rect.height + "px"; tooltipNode.style.display = "block"; + tooltipNode.style.maxWidth = "500px"; + tooltipNode.style.whiteSpace = "normal"; + tooltipNode.style.wordWrap = "normal"; + tooltipNode.style.textAlign = "left"; }; this.hideDocTooltip = function() {