maxmustermann/vscode
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Merge pull request #1217 from dstorey/update-css-intellisense

Browse source 
[css] Update css intellisense and css.plist
This commit is contained in:
Martin Aeschlimann 2016-01-12 11:17:55 +01:00
parent 3a69eff8da 04cee66ced
commit 0babb42991
8 changed files with 8404 additions and 16273 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

174
extensions/css/syntaxes/css.plist
View file

File diff suppressed because one or more lines are too long

17833
src/vs/languages/css/common/buildscripts/css-schema.xml
View file

File diff suppressed because it is too large Load diff

6370
src/vs/languages/css/common/services/browsers.js
View file

File diff suppressed because it is too large Load diff

147
src/vs/languages/css/common/services/intelliSense.ts
View file

@ -133,7 +133,15 @@ export class CSSIntellisense {
if (entry) {
this.getColorProposals(entry, result);
this.getPositionProposals(entry, result);
this.getRepeatStyleProposals(entry, result);
this.getLineProposals(entry, result);
this.getBoxProposals(entry, result);
this.getImageProposals(entry, result);
this.getTimingFunctionProposals(entry, result);
this.getBasicShapeProposals(entry, result);
this.getValueEnumProposals(entry, result);
this.getCSSWideKeywordProposals(entry, result);
this.getUnitProposals(entry, result);
} else {
var existingValues = new Set();
@ -168,6 +176,18 @@ export class CSSIntellisense {
return result;
}
public getCSSWideKeywordProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
for (var keywords in languageFacts.cssWideKeywords) {
result.push({
label: keywords,
documentationLabel: languageFacts.cssWideKeywords[keywords],
codeSnippet: keywords,
type: 'value'
});
}
return result;
}
public getCompletionsForInterpolation(node: nodes.Interpolation, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (this.offset >= node.offset + 2) {
this.getVariableProposals(result);
@ -226,7 +246,7 @@ export class CSSIntellisense {
label: color,
documentationLabel: languageFacts.colorKeywords[color],
codeSnippet: color,
type: 'function'
type: 'value'
});
}
var colorValues = new Set();
@ -251,6 +271,124 @@ export class CSSIntellisense {
return result;
}
protected getPositionProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (entry.restrictions.indexOf('position') !== -1) {
for (var position in languageFacts.positionKeywords) {
result.push({
label: position,
documentationLabel: languageFacts.positionKeywords[position],
codeSnippet: position,
type: 'value'
});
}
};
return result;
}
protected getRepeatStyleProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (entry.restrictions.indexOf('repeat') !== -1) {
for (var repeat in languageFacts.repeatStyleKeywords) {
result.push({
label: repeat,
documentationLabel: languageFacts.repeatStyleKeywords[repeat],
codeSnippet: repeat,
type: 'value'
});
}
};
return result;
}
protected getLineProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (entry.restrictions.indexOf('line-style') !== -1) {
for (var lineStyle in languageFacts.lineStyleKeywords) {
result.push({
label: lineStyle,
documentationLabel: languageFacts.lineStyleKeywords[lineStyle],
codeSnippet: lineStyle,
type: 'value'
});
}
};
if (entry.restrictions.indexOf('line-width') !== -1) {
languageFacts.lineWidthKeywords.forEach((lineWidth) => {
result.push({
label: lineWidth,
codeSnippet: lineWidth,
type: 'value'
});
});
};
return result;
}
protected getBoxProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
var geometryBox = entry.restrictions.indexOf('geometry-box');
if (geometryBox !== -1) {
for (var box in languageFacts.geometryBoxKeywords) {
result.push({
label: box,
documentationLabel: languageFacts.geometryBoxKeywords[box],
codeSnippet: box,
type: 'value'
});
}
};
if (entry.restrictions.indexOf('box') !== -1 || geometryBox !== -1) {
for (var box in languageFacts.boxKeywords) {
result.push({
label: box,
documentationLabel: languageFacts.boxKeywords[box],
codeSnippet: box,
type: 'value'
});
}
};
return result;
}
protected getImageProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (entry.restrictions.indexOf('image') !== -1) {
for (var image in languageFacts.imageFunctions) {
result.push({
label: image,
documentationLabel: languageFacts.imageFunctions[image],
codeSnippet: image,
type: 'function'
});
}
};
return result;
}
protected getTimingFunctionProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (entry.restrictions.indexOf('timing-function') !== -1) {
for (var timing in languageFacts.transitionTimingFunctions) {
result.push({
label: timing,
documentationLabel: languageFacts.transitionTimingFunctions[timing],
codeSnippet: timing,
type: 'function'
});
}
};
return result;
}
protected getBasicShapeProposals(entry:languageFacts.IEntry, result:Modes.ISuggestion[]):Modes.ISuggestion[] {
if (entry.restrictions.indexOf('shape') !== -1) {
for (var shape in languageFacts.basicShapeFunctions) {
result.push({
label: shape,
documentationLabel: languageFacts.basicShapeFunctions[shape],
codeSnippet: shape,
type: 'function'
});
}
};
return result;
}
public getCompletionsForStylesheet(result:Modes.ISuggestion[]):Modes.ISuggestion[] {
var node = this.styleSheet.findFirstChildBeforeOffset(this.offset);
if (!node) {
@ -321,6 +459,13 @@ export class CSSIntellisense {
type: 'keyword'
});
});
languageFacts.svgElements.forEach((entry) => {
result.push({
label: entry,
codeSnippet: entry,
type: 'keyword'
});
});
var visited: { [name: string]: boolean } = {};
visited[this.currentWord] = true;

134
src/vs/languages/css/common/services/languageFacts.ts
View file

@ -189,8 +189,126 @@ export var colorKeywords : { [name:string]:string } = {
'transparent': 'Fully transparent. This keyword can be considered a shorthand for rgba(0,0,0,0) which is its computed value.',
'Window': 'Window background.',
'WindowFrame': 'Window frame.',
'WindowText': 'Text in windows.',
'none': ''
'WindowText': 'Text in windows.'
};
export var positionKeywords : { [name:string]:string } = {
'bottom': 'Computes to ‘100%’ for the vertical position if one or two values are given, otherwise specifies the bottom edge as the origin for the next offset.',
'center': 'Computes to ‘50%’ (‘left 50%’) for the horizontal position if the horizontal position is not otherwise specified, or ‘50%’ (‘top 50%’) for the vertical position if it is.',
'left': 'Computes to ‘0%’ for the horizontal position if one or two values are given, otherwise specifies the left edge as the origin for the next offset.',
'right': 'Computes to ‘100%’ for the horizontal position if one or two values are given, otherwise specifies the right edge as the origin for the next offset.',
'top': 'Computes to ‘0%’ for the vertical position if one or two values are given, otherwise specifies the top edge as the origin for the next offset.'
};
export var repeatStyleKeywords : { [name:string]:string } = {
'no-repeat': 'Placed once and not repeated in this direction.',
'repeat': 'Repeated in this direction as often as needed to cover the background painting area.',
'repeat-x': 'Computes to ‘repeat no-repeat’.',
'repeat-y': 'Computes to ‘no-repeat repeat’.',
'round': 'Repeated as often as will fit within the background positioning area. If it doesn’t fit a whole number of times, it is rescaled so that it does.',
'space': 'Repeated as often as will fit within the background positioning area without being clipped and then the images are spaced out to fill the area.'
};
export var lineStyleKeywords : { [name:string]:string } = {
'dashed': 'A series of square-ended dashes.',
'dotted': 'A series of round dots.',
'double': 'Two parallel solid lines with some space between them.',
'groove': 'Looks as if it were carved in the canvas.',
'hidden': 'Same as ‘none’, but has different behavior in the border conflict resolution rules for border-collapsed tables.',
'inset': 'Looks as if the content on the inside of the border is sunken into the canvas.',
'none': 'No border. Color and width are ignored.',
'outset': 'Looks as if the content on the inside of the border is coming out of the canvas.',
'ridge': 'Looks as if it were coming out of the canvas.',
'solid': 'A single line segment.'
};
export var lineWidthKeywords = ['medium', 'thick', 'thin'];
export var boxKeywords : { [name:string]:string } = {
'border-box': 'The background is painted within (clipped to) the border box.',
'content-box': 'The background is painted within (clipped to) the content box.',
'padding-box': 'The background is painted within (clipped to) the padding box.'
};
export var geometryBoxKeywords : { [name:string]:string } = {
'margin-box': 'Uses the margin box as reference box.',
'fill-box': 'Uses the object bounding box as reference box.',
'stroke-box': 'Uses the stroke bounding box as reference box.',
'view-box': 'Uses the nearest SVG viewport as reference box.'
};
export var cssWideKeywords : { [name:string]:string } = {
'initial': 'Represents the value specified as the property’s initial value.',
'inherit': 'Represents the computed value of the property on the element’s parent.',
'unset': 'Acts as either `inherit` or `initial`, depending on whether the property is inherited or not.'
};
export var imageFunctions : { [name:string]:string } = {
'url()': 'Reference an image file by URL',
'image()': 'Provide image fallbacks and annotations.',
'-webkit-image-set()': 'Provide multiple resolutions. Remember to use unprefixed image-set() in addition.',
'image-set()': 'Provide multiple resolutions of an image and let the UA decide which is most appropriate in a given situation.',
'-moz-element()': 'Use an element in the document as an image. Remember to use unprefixed element() in addition.',
'element()': 'Use an element in the document as an image.',
'cross-fade()': 'Indicates the two images to be combined and how far along in the transition the combination is.',
'-webkit-gradient()': 'Deprecated. Use modern linear-gradient() or radial-gradient() instead.',
'-webkit-linear-gradient()': 'Linear gradient. Remember to use unprefixed version in addition.',
'-moz-linear-gradient()': 'Linear gradient. Remember to use unprefixed version in addition.',
'-o-linear-gradient()': 'Linear gradient. Remember to use unprefixed version in addition.',
'linear-gradient()': 'A linear gradient is created by specifying a straight gradient line, and then several colors placed along that line.',
'-webkit-repeating-linear-gradient()': 'Repeating Linear gradient. Remember to use unprefixed version in addition.',
'-moz-repeating-linear-gradient()': 'Repeating Linear gradient. Remember to use unprefixed version in addition.',
'-o-repeating-linear-gradient()': 'RepeatingLinear gradient. Remember to use unprefixed version in addition.',
'repeating-linear-gradient()': 'Same as linear-gradient, except the color-stops are repeated infinitely in both directions, with their positions shifted by multiples of the difference between the last specified color-stop’s position and the first specified color-stop’s position.',
'-webkit-radial-gradient()': 'Radial gradient. Remember to use unprefixed version in addition.',
'-moz-radial-gradient()': 'Radial gradient. Remember to use unprefixed version in addition.',
'radial-gradient()': 'Colors emerge from a single point and smoothly spread outward in a circular or elliptical shape.',
'-webkit-repeating-radial-gradient()': 'Repeating radial gradient. Remember to use unprefixed version in addition.',
'-moz-repeating-radial-gradient()': 'Repeating radial gradient. Remember to use unprefixed version in addition.',
'repeating-radial-gradient()': 'Same as radial-gradient, except the color-stops are repeated infinitely in both directions, with their positions shifted by multiples of the difference between the last specified color-stop’s position and the first specified color-stop’s position.'
};
export var transitionTimingFunctions : { [name:string]:string } = {
'ease': 'Equivalent to cubic-bezier(0.25, 0.1, 0.25, 1.0).',
'ease-in': 'Equivalent to cubic-bezier(0.42, 0, 1.0, 1.0).',
'ease-in-out': 'Equivalent to cubic-bezier(0.42, 0, 0.58, 1.0).',
'ease-out': 'Equivalent to cubic-bezier(0, 0, 0.58, 1.0).',
'linear': 'Equivalent to cubic-bezier(0.0, 0.0, 1.0, 1.0).',
'step-end': 'Equivalent to steps(1, end).',
'step-start': 'Equivalent to steps(1, start).',
'steps()': 'The first parameter specifies the number of intervals in the function. The second parameter, which is optional, is either the value “start” or “end”.',
'cubic-bezier()': 'Specifies a cubic-bezier curve. The four values specify points P1 and P2 of the curve as (x1, y1, x2, y2).',
'cubic-bezier(0.6, -0.28, 0.735, 0.045)': 'Ease-in Back. Overshoots.',
'cubic-bezier(0.68, -0.55, 0.265, 1.55)': 'Ease-in-out Back. Overshoots.',
'cubic-bezier(0.175, 0.885, 0.32, 1.275)': 'Ease-out Back. Overshoots.',
'cubic-bezier(0.6, 0.04, 0.98, 0.335)': 'Ease-in Circular. Based on half circle.',
'cubic-bezier(0.785, 0.135, 0.15, 0.86)': 'Ease-in-out Circular. Based on half circle.',
'cubic-bezier(0.075, 0.82, 0.165, 1)': 'Ease-out Circular. Based on half circle.',
'cubic-bezier(0.55, 0.055, 0.675, 0.19)': 'Ease-in Cubic. Based on power of three.',
'cubic-bezier(0.645, 0.045, 0.355, 1)': 'Ease-in-out Cubic. Based on power of three.',
'cubic-bezier(0.215, 0.610, 0.355, 1)': 'Ease-out Cubic. Based on power of three.',
'cubic-bezier(0.95, 0.05, 0.795, 0.035)': 'Ease-in Exponential. Based on two to the power ten.',
'cubic-bezier(1, 0, 0, 1)': 'Ease-in-out Exponential. Based on two to the power ten.',
'cubic-bezier(0.19, 1, 0.22, 1)': 'Ease-out Exponential. Based on two to the power ten.',
'cubic-bezier(0.47, 0, 0.745, 0.715)': 'Ease-in Sine.',
'cubic-bezier(0.445, 0.05, 0.55, 0.95)': 'Ease-in-out Sine.',
'cubic-bezier(0.39, 0.575, 0.565, 1)': 'Ease-out Sine.',
'cubic-bezier(0.55, 0.085, 0.68, 0.53)': 'Ease-in Quadratic. Based on power of two.',
'cubic-bezier(0.455, 0.03, 0.515, 0.955)': 'Ease-in-out Quadratic. Based on power of two.',
'cubic-bezier(0.25, 0.46, 0.45, 0.94)': 'Ease-out Quadratic. Based on power of two.',
'cubic-bezier(0.895, 0.03, 0.685, 0.22)': 'Ease-in Quartic. Based on power of four.',
'cubic-bezier(0.77, 0, 0.175, 1)': 'Ease-in-out Quartic. Based on power of four.',
'cubic-bezier(0.165, 0.84, 0.44, 1)': 'Ease-out Quartic. Based on power of four.',
'cubic-bezier(0.755, 0.05, 0.855, 0.06)': 'Ease-in Quintic. Based on power of five.',
'cubic-bezier(0.86, 0, 0.07, 1)': 'Ease-in-out Quintic. Based on power of five.',
'cubic-bezier(0.23, 1, 0.320, 1)': 'Ease-out Quintic. Based on power of five.'
};
export var basicShapeFunctions : { [name:string]:string } = {
'circle()': 'Defines a circle.',
'ellipse()': 'Defines an ellipse.',
'inset()': 'Defines an inset rectangle.',
'polygon()': 'Defines a polygon.'
};
export var units : { [unitName:string]:string[] } = {
@ -205,9 +323,15 @@ export var units : { [unitName:string]:string[] } = {
export var html5Tags = ['a', 'abbr', 'address', 'area', 'article', 'aside', 'audio', 'b', 'base', 'bdi', 'bdo', 'blockquote', 'body', 'br', 'button', 'canvas', 'caption',
'cite', 'code', 'col', 'colgroup', 'data', 'datalist', 'dd', 'del', 'details', 'dfn', 'dialog', 'div', 'dl', 'dt', 'em', 'embed', 'fieldset', 'figcaption', 'figure', 'footer',
'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'head', 'header', 'hgroup', 'hr', 'html', 'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'legend', 'li', 'link',
'main', 'map', 'mark', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'pre', 'progress', 'q', 'rb',
'rp', 'rt', 'rtc', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'svg', 'table', 'tbody', 'td', 'template',
'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr' ];
'main', 'map', 'mark', 'menu', 'menuitem', 'meta', 'meter', 'nav', 'noscript', 'object', 'ol', 'optgroup', 'option', 'output', 'p', 'param', 'picture', 'pre', 'progress', 'q',
'rb', 'rp', 'rt', 'rtc', 'ruby', 's', 'samp', 'script', 'section', 'select', 'small', 'source', 'span', 'strong', 'style', 'sub', 'summary', 'sup', 'table', 'tbody', 'td',
'template', 'textarea', 'tfoot', 'th', 'thead', 'time', 'title', 'tr', 'track', 'u', 'ul', 'var', 'video', 'wbr' ];
export var svgElements = ['circle', 'clipPath', 'cursor', 'defs', 'desc', 'ellipse', 'feBlend', 'feColorMatrix', 'feComponentTransfer', 'feComposite', 'feConvolveMatrix', 'feDiffuseLighting',
'feDisplacementMap', 'feDistantLight', 'feDropShadow', 'feFlood', 'feFuncA', 'feFuncB', 'feFuncG', 'feFuncR', 'feGaussianBlur', 'feImage', 'feMerge', 'feMergeNode', 'feMorphology',
'feOffset', 'fePointLight', 'feSpecularLighting', 'feSpotLight', 'feTile', 'feTurbulence', 'filter', 'foreignObject', 'g', 'hatch', 'hatchpath', 'image', 'line', 'linearGradient',
'marker', 'mask', 'mesh', 'meshpatch', 'meshrow', 'metadata', 'mpath', 'path', 'pattern', 'polygon', 'polyline', 'radialGradient', 'rect', 'set', 'solidcolor', 'stop', 'svg', 'switch',
'symbol', 'text', 'textPath', 'tspan', 'use', 'view'];
export function isColorConstructor(node:nodes.Function): boolean {
var name = node.getName();

8
src/vs/languages/css/test/common/css-worker.test.ts
View file

@ -274,16 +274,16 @@ suite('Validation - CSS', () => {
test('Value sets', function(testDone): any {
WinJS.Promise.join([
testValueSetFor('body { display: inline }', 'inline', 6, false).then(function(result:Modes.IInplaceReplaceSupportResult):void {
assertReplaceResult(result, 'flexbox');
assertReplaceResult(result, 'flex');
}),
testValueSetFor('body { display: flexbox }', 'flexbox', 7, true).then(function(result:Modes.IInplaceReplaceSupportResult):void {
testValueSetFor('body { display: flex }', 'flex', 7, true).then(function(result:Modes.IInplaceReplaceSupportResult):void {
assertReplaceResult(result, 'inline');
}),
testValueSetFor('body { display: inline }', 'inline', 0, false).then(function(result:Modes.IInplaceReplaceSupportResult):void {
assertReplaceResult(result, 'flexbox');
assertReplaceResult(result, 'flex');
}),
testValueSetFor('body { display: inline }', 'line', 0, false).then(function(result:Modes.IInplaceReplaceSupportResult):void {
assertReplaceResult(result, 'flexbox');
assertReplaceResult(result, 'flex');
}),
testValueSetFor('body { display: inline }', 'display', 0, false).then(function(result:Modes.IInplaceReplaceSupportResult):void {
assert.ok(!result);

3
src/vs/languages/css/test/common/languageFacts.test.ts
View file

@ -29,7 +29,8 @@ suite('CSS language facts', () => {
var b = alignLast.browsers;
assert.equal(b['FF'], '12');
assert.equal(b['IE'], '5');
assert.equal(b['count'], 2);
assert.equal(b['E'], '');
assert.equal(b['count'], 3);
assert.equal(languageFacts.getBrowserLabel(alignLast.browsers) , 'Firefox 12, IE 5');

8
src/vs/languages/sass/test/common/sass-worker.test.ts
View file

@ -126,16 +126,16 @@ suite('SASS - Worker', () => {
test('Sass Value sets', function(testDone): any {
WinJS.Promise.join([
testValueSetFor('@mixin foo { display: inline }', 'inline', 6, false).then((result) => {
assertReplaceResult(result, 'flexbox');
assertReplaceResult(result, 'flex');
}),
testValueSetFor('@mixin foo($i) { display: flexbox }', 'flexbox', 7, true).then((result) => {
testValueSetFor('@mixin foo($i) { display: flex }', 'flex', 7, true).then((result) => {
assertReplaceResult(result, 'inline');
}),
testValueSetFor('.foo { .bar { display: inline } }', 'inline', 0, false).then((result) => {
assertReplaceResult(result, 'flexbox');
assertReplaceResult(result, 'flex');
}),
testValueSetFor('@mixin foo { display: inline }', 'line', 0, false).then((result) => {
assertReplaceResult(result, 'flexbox');
assertReplaceResult(result, 'flex');
}),
testValueSetFor('@mixin foo { display: inline }', 'display', 0, false).then((result) => {