Skip to content
This repository was archived by the owner on Sep 6, 2021. It is now read-only.

Commit fcd2e98

Browse files
committed
Adding preference to enable/disable type details
Styling changes for the type details
1 parent ad260bb commit fcd2e98

File tree

3 files changed

+88
-107
lines changed

3 files changed

+88
-107
lines changed

src/extensions/default/JavaScriptCodeHints/main.js

+50-87
Original file line numberDiff line numberDiff line change
@@ -46,14 +46,15 @@ define(function (require, exports, module) {
4646
Session = require("Session"),
4747
Acorn = require("thirdparty/acorn/acorn");
4848

49-
var session = null, // object that encapsulates the current session state
50-
cachedCursor = null, // last cursor of the current hinting session
51-
cachedHints = null, // sorted hints for the current hinting session
52-
cachedType = null, // describes the lookup type and the object context
53-
cachedToken = null, // the token used in the current hinting session
54-
matcher = null, // string matcher for hints
55-
jsHintsEnabled = true, // preference setting to enable/disable the hint session
56-
noHintsOnDot = false, // preference setting to prevent hints on dot
49+
var session = null, // object that encapsulates the current session state
50+
cachedCursor = null, // last cursor of the current hinting session
51+
cachedHints = null, // sorted hints for the current hinting session
52+
cachedType = null, // describes the lookup type and the object context
53+
cachedToken = null, // the token used in the current hinting session
54+
matcher = null, // string matcher for hints
55+
jsHintsEnabled = true, // preference setting to enable/disable the hint session
56+
hintDetailsEnabled = true, // preference setting to enable/disable hint type details
57+
noHintsOnDot = false, // preference setting to prevent hints on dot
5758
ignoreChange; // can ignore next "change" event if true;
5859

5960
// Languages that support inline JavaScript
@@ -78,6 +79,11 @@ define(function (require, exports, module) {
7879
PreferencesManager.definePreference("codehint.JSHints", "boolean", true, {
7980
description: Strings.DESCRIPTION_JS_HINTS
8081
});
82+
83+
// This preference controls whether detailed type metadata will be desplayed within hint list. Deafults to true.
84+
PreferencesManager.definePreference("jscodehints.typedetails", "boolean", true, {
85+
description: Strings.DESCRIPTION_JS_HINTS_TYPE_DETAILS
86+
});
8187

8288
/**
8389
* Check whether any of code hints preferences for JS Code Hints is disabled
@@ -100,6 +106,10 @@ define(function (require, exports, module) {
100106
noHintsOnDot = !!PreferencesManager.get("jscodehints.noHintsOnDot");
101107
});
102108

109+
PreferencesManager.on("change", "jscodehints.typedetails", function () {
110+
hintDetailsEnabled = PreferencesManager.get("jscodehints.typedetails");
111+
});
112+
103113
/**
104114
* Sets the configuration, generally for testing/debugging use.
105115
* Configuration keys are merged into the current configuration.
@@ -149,62 +159,42 @@ define(function (require, exports, module) {
149159
console.debug("Hints", _.pluck(hints, "label"));
150160
}
151161

152-
var _infered = true;
153-
154-
function getInferHelper(type) {
155-
return function (element, index, array) {
156-
if (element === type && _infered) {
157-
_infered = true;
158-
} else {
159-
_infered = false;
160-
}
161-
};
162-
}
163-
164-
function inferArrayTypeClass(typeExpr) {
165-
var type = "type-array";
166-
var types = typeExpr.split('[')[1].split(']')[0].split(',');
167-
168-
_infered = true;
162+
function formatTypeDataForToken($hintObj, token) {
169163

170-
types.every(getInferHelper('string'));
171-
if (_infered) {
172-
type = 'type-string-array';
173-
} else {
174-
_infered = true;
175-
types.every(getInferHelper('number'));
176-
if (_infered) {
177-
type = 'type-num-array';
178-
} else {
179-
_infered = true;
180-
types.every(getInferHelper('Object'));
181-
if (_infered) {
182-
type = 'type-object-array';
164+
if (!hintDetailsEnabled) {
165+
return;
166+
}
167+
168+
$hintObj.addClass('brackets-js-hints-with-type-details');
169+
170+
(function _appendLink() {
171+
if (token.url) {
172+
$('<a></a>').appendTo($hintObj).addClass("jshint-link").attr('href', token.url).on("click", function (event) {
173+
event.stopImmediatePropagation();
174+
event.stopPropagation();
175+
});
176+
}
177+
}());
178+
179+
if (token.type) {
180+
if (token.type.trim() !== '?') {
181+
if (token.type.length < 30) {
182+
$('<span>' + token.type.split('->').join(':').toString().trim() + '</span>').appendTo($hintObj).addClass("brackets-js-hints-type-details");
183183
}
184+
$('<span>' + token.type.split('->').join(':').toString().trim() + '</span>').appendTo($hintObj).addClass("jshint-description");
184185
}
185-
}
186-
return type;
187-
}
188-
189-
function getRenderTypeClass(type) {
190-
var typeClass = 'type-undetermined';
191-
if (type) {
192-
if (type.indexOf('Object') === 0) {
193-
typeClass = 'type-object';
194-
} else if (type.indexOf('[') === 0) {
195-
typeClass = inferArrayTypeClass(type);
196-
} else if (type.indexOf('fn') === 0) {
197-
typeClass = 'type-function';
198-
} else if (type.indexOf('string') === 0) {
199-
typeClass = "type-string";
200-
} else if (type.indexOf('number') === 0) {
201-
typeClass = 'type-number';
202-
} else if (type.indexOf('bool') === 0) {
203-
typeClass = 'type-boolean';
186+
} else {
187+
if (token.keyword) {
188+
$('<span>keyword</span>').appendTo($hintObj).addClass("brackets-js-hints-keyword");
204189
}
205190
}
206-
return typeClass;
191+
192+
if (token.doc) {
193+
$hintObj.attr('title', token.doc);
194+
$('<span></span>').text(token.doc.trim()).appendTo($hintObj).addClass("jshint-jsdoc");
195+
}
207196
}
197+
208198

209199
/*
210200
* Returns a formatted list of hints with the query substring
@@ -222,8 +212,7 @@ define(function (require, exports, module) {
222212
function formatHints(hints, query) {
223213
return hints.map(function (token) {
224214
var $hintObj = $("<span>").addClass("brackets-js-hints");
225-
($hintObj).addClass(getRenderTypeClass(token.type));
226-
//$('<span>' + getRenderType(token.type) + '</span>').appendTo($hintObj).addClass("brackets-js-hints-type");
215+
227216
// level indicates either variable scope or property confidence
228217
if (!type.property && !token.builtin && token.depth !== undefined) {
229218
switch (token.depth) {
@@ -272,33 +261,7 @@ define(function (require, exports, module) {
272261

273262
$hintObj.data("token", token);
274263

275-
function _appendLink() {
276-
if (token.url) {
277-
$('<a></a>').appendTo($hintObj).addClass("jshint-link").attr('href', token.url).on("click", function (event) {
278-
event.stopImmediatePropagation();
279-
event.stopPropagation();
280-
});
281-
}
282-
}
283-
284-
if (token.type) {
285-
if (token.type.length > 40) {
286-
_appendLink();
287-
$('<span>' + token.type.split('->').join(':').toString().trim() + '</span>').appendTo($hintObj).addClass("jshint-description");
288-
} else {
289-
$('<span>' + token.type.split('->').join(':').toString().trim() + '</span>').appendTo($hintObj).addClass("brackets-js-hints-type-details");
290-
_appendLink();
291-
}
292-
} else {
293-
if (token.keyword) {
294-
$('<span>keyword</span>').appendTo($hintObj).addClass("brackets-js-hints-type-details").addClass("keyword");
295-
}
296-
}
297-
298-
if (token.doc) {
299-
$hintObj.attr('title', token.doc);
300-
$('<span></span>').text(token.doc.trim()).appendTo($hintObj).addClass("jshint-jsdoc");
301-
}
264+
formatTypeDataForToken($hintObj, token);
302265

303266
return $hintObj;
304267
});

src/extensions/default/JavaScriptCodeHints/styles/brackets-js-hints.css

+37-20
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,8 @@
2222
*/
2323

2424

25-
span.brackets-js-hints {
26-
width: 400px;
25+
span.brackets-js-hints-with-type-details {
26+
width: 300px;
2727
display: inline-block;
2828
}
2929

@@ -137,7 +137,7 @@ span.brackets-js-hints {
137137
}
138138

139139
.brackets-js-hints-type-details {
140-
color: #d3d3d3 !important;
140+
color: #a3a3a3 !important;
141141
font-weight: 100;
142142
font-style: italic !important;
143143
margin-right: 5px;
@@ -146,12 +146,10 @@ span.brackets-js-hints {
146146

147147
.jshint-description {
148148
display: none;
149-
padding-left: 28px !important;
150-
padding-right:10px !important;
151149
color: #d4d4d4;
152150
word-wrap: break-word;
153151
white-space: normal;
154-
width:400px;
152+
width:300px;
155153
box-sizing: border-box;
156154
}
157155

@@ -161,12 +159,11 @@ span.brackets-js-hints {
161159

162160
.jshint-jsdoc {
163161
display: none;
164-
padding-left: 28px !important;
165162
padding-right: 10px !important;
166163
color: grey;
167164
word-wrap: break-word;
168165
white-space: normal;
169-
width: 400px;
166+
width: 300px;
170167
box-sizing: border-box;
171168
float: left;
172169
clear: left;
@@ -179,24 +176,41 @@ span.brackets-js-hints {
179176
}
180177

181178
.jshint-link {
182-
float:right;
183179
display:none;
184-
margin-right: 10px !important;
180+
width:0px !important;
181+
height:1px !important;
182+
margin-left: 15px;
183+
float:right;
185184
}
186185

187186
.jshint-link:before {
188-
float: right;
189-
color: orangered !important;
190-
content: '?' !important;
191-
border: 1px orangered solid;
192-
width: 10px;
187+
position: relative;
188+
float: left;
189+
top:1px;
190+
content: "i" !important;
191+
width: 16px;
192+
height: 16px;
193+
margin-right:10px;
194+
font-size: 14px;
195+
font-weight: bold;
196+
font-style: italic;
197+
line-height: 15px;
193198
text-align: center;
194-
line-height: 1em;
195199
visibility: visible !important;
200+
font-weight: 900;
201+
color: #fff;
202+
background-color: #2ea56c;
203+
border-color: #177F42;
204+
border-radius: 16px;
205+
font-family: SourceSansPro-Semibold;
206+
}
207+
208+
.dark .jshint-link:before {
209+
background-color: #146a41;
196210
}
197211

198212
.highlight .jshint-link {
199-
display:block;
213+
display: inline-block !important;
200214
}
201215

202216
.highlight .jshint-description {
@@ -213,11 +227,14 @@ span.brackets-js-hints {
213227
}
214228

215229
.highlight .brackets-js-hints-type-details {
216-
color: #6495ed !important;
217-
display: inline-block;
230+
display:none;
218231
}
219232

220-
.brackets-js-hints-type-details.keyword {
233+
.brackets-js-hints-keyword {
234+
font-weight: 100;
235+
font-style: italic !important;
236+
margin-right: 5px;
237+
float:right;
221238
color: #6495ed !important;
222239
}
223240

src/nls/root/strings.js

+1
Original file line numberDiff line numberDiff line change
@@ -691,6 +691,7 @@ define({
691691
"DESCRIPTION_ATTR_HINTS" : "Enable/disable HTML attribute hints",
692692
"DESCRIPTION_CSS_PROP_HINTS" : "Enable/disable CSS/LESS/SCSS property hints",
693693
"DESCRIPTION_JS_HINTS" : "Enable/disable JavaScript code hints",
694+
"DESCRIPTION_JS_HINTS_TYPE_DETAILS" : "Enable/disable datatype details in JavaScript code hints",
694695
"DESCRIPTION_PREF_HINTS" : "Enable/disable Preferences code hints",
695696
"DESCRIPTION_SPECIAL_CHAR_HINTS" : "Enable/disable HTML entity hints",
696697
"DESCRIPTION_SVG_HINTS" : "Enable/disable SVG code hints",

0 commit comments

Comments
 (0)