1 | var InvalidPropertyError = require('../invalid-property-error');
|
---|
2 |
|
---|
3 | var wrapSingle = require('../wrap-for-optimizing').single;
|
---|
4 |
|
---|
5 | var Token = require('../../tokenizer/token');
|
---|
6 | var Marker = require('../../tokenizer/marker');
|
---|
7 |
|
---|
8 | var formatPosition = require('../../utils/format-position');
|
---|
9 |
|
---|
10 | function _anyIsInherit(values) {
|
---|
11 | var i, l;
|
---|
12 |
|
---|
13 | for (i = 0, l = values.length; i < l; i++) {
|
---|
14 | if (values[i][1] == 'inherit') {
|
---|
15 | return true;
|
---|
16 | }
|
---|
17 | }
|
---|
18 |
|
---|
19 | return false;
|
---|
20 | }
|
---|
21 |
|
---|
22 | function _colorFilter(validator) {
|
---|
23 | return function(value) {
|
---|
24 | return value[1] == 'invert' || validator.isColor(value[1]) || validator.isPrefixed(value[1]);
|
---|
25 | };
|
---|
26 | }
|
---|
27 |
|
---|
28 | function _styleFilter(validator) {
|
---|
29 | return function(value) {
|
---|
30 | return value[1] != 'inherit' && validator.isStyleKeyword(value[1]) && !validator.isColorFunction(value[1]);
|
---|
31 | };
|
---|
32 | }
|
---|
33 |
|
---|
34 | function _wrapDefault(name, property, configuration) {
|
---|
35 | var descriptor = configuration[name];
|
---|
36 | if (descriptor.doubleValues && descriptor.defaultValue.length == 2) {
|
---|
37 | return wrapSingle([
|
---|
38 | Token.PROPERTY,
|
---|
39 | [Token.PROPERTY_NAME, name],
|
---|
40 | [Token.PROPERTY_VALUE, descriptor.defaultValue[0]],
|
---|
41 | [Token.PROPERTY_VALUE, descriptor.defaultValue[1]]
|
---|
42 | ]);
|
---|
43 | } if (descriptor.doubleValues && descriptor.defaultValue.length == 1) {
|
---|
44 | return wrapSingle([
|
---|
45 | Token.PROPERTY,
|
---|
46 | [Token.PROPERTY_NAME, name],
|
---|
47 | [Token.PROPERTY_VALUE, descriptor.defaultValue[0]]
|
---|
48 | ]);
|
---|
49 | }
|
---|
50 | return wrapSingle([
|
---|
51 | Token.PROPERTY,
|
---|
52 | [Token.PROPERTY_NAME, name],
|
---|
53 | [Token.PROPERTY_VALUE, descriptor.defaultValue]
|
---|
54 | ]);
|
---|
55 | }
|
---|
56 |
|
---|
57 | function _widthFilter(validator) {
|
---|
58 | return function(value) {
|
---|
59 | return value[1] != 'inherit'
|
---|
60 | && (validator.isWidth(value[1]) || validator.isUnit(value[1]) || validator.isDynamicUnit(value[1]))
|
---|
61 | && !validator.isStyleKeyword(value[1])
|
---|
62 | && !validator.isColorFunction(value[1]);
|
---|
63 | };
|
---|
64 | }
|
---|
65 |
|
---|
66 | function animation(property, configuration, validator) {
|
---|
67 | var duration = _wrapDefault(property.name + '-duration', property, configuration);
|
---|
68 | var timing = _wrapDefault(property.name + '-timing-function', property, configuration);
|
---|
69 | var delay = _wrapDefault(property.name + '-delay', property, configuration);
|
---|
70 | var iteration = _wrapDefault(property.name + '-iteration-count', property, configuration);
|
---|
71 | var direction = _wrapDefault(property.name + '-direction', property, configuration);
|
---|
72 | var fill = _wrapDefault(property.name + '-fill-mode', property, configuration);
|
---|
73 | var play = _wrapDefault(property.name + '-play-state', property, configuration);
|
---|
74 | var name = _wrapDefault(property.name + '-name', property, configuration);
|
---|
75 | var components = [duration, timing, delay, iteration, direction, fill, play, name];
|
---|
76 | var values = property.value;
|
---|
77 | var value;
|
---|
78 | var durationSet = false;
|
---|
79 | var timingSet = false;
|
---|
80 | var delaySet = false;
|
---|
81 | var iterationSet = false;
|
---|
82 | var directionSet = false;
|
---|
83 | var fillSet = false;
|
---|
84 | var playSet = false;
|
---|
85 | var nameSet = false;
|
---|
86 | var i;
|
---|
87 | var l;
|
---|
88 |
|
---|
89 | if (property.value.length == 1 && property.value[0][1] == 'inherit') {
|
---|
90 | // eslint-disable-next-line max-len
|
---|
91 | duration.value = timing.value = delay.value = iteration.value = direction.value = fill.value = play.value = name.value = property.value;
|
---|
92 | return components;
|
---|
93 | }
|
---|
94 |
|
---|
95 | if (values.length > 1 && _anyIsInherit(values)) {
|
---|
96 | throw new InvalidPropertyError('Invalid animation values at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
97 | }
|
---|
98 |
|
---|
99 | for (i = 0, l = values.length; i < l; i++) {
|
---|
100 | value = values[i];
|
---|
101 |
|
---|
102 | if (validator.isTime(value[1]) && !durationSet) {
|
---|
103 | duration.value = [value];
|
---|
104 | durationSet = true;
|
---|
105 | } else if (validator.isTime(value[1]) && !delaySet) {
|
---|
106 | delay.value = [value];
|
---|
107 | delaySet = true;
|
---|
108 | } else if ((validator.isGlobal(value[1]) || validator.isTimingFunction(value[1])) && !timingSet) {
|
---|
109 | timing.value = [value];
|
---|
110 | timingSet = true;
|
---|
111 | } else if ((validator.isAnimationIterationCountKeyword(value[1])
|
---|
112 | || validator.isPositiveNumber(value[1]))
|
---|
113 | && !iterationSet) {
|
---|
114 | iteration.value = [value];
|
---|
115 | iterationSet = true;
|
---|
116 | } else if (validator.isAnimationDirectionKeyword(value[1]) && !directionSet) {
|
---|
117 | direction.value = [value];
|
---|
118 | directionSet = true;
|
---|
119 | } else if (validator.isAnimationFillModeKeyword(value[1]) && !fillSet) {
|
---|
120 | fill.value = [value];
|
---|
121 | fillSet = true;
|
---|
122 | } else if (validator.isAnimationPlayStateKeyword(value[1]) && !playSet) {
|
---|
123 | play.value = [value];
|
---|
124 | playSet = true;
|
---|
125 | } else if ((validator.isAnimationNameKeyword(value[1]) || validator.isIdentifier(value[1])) && !nameSet) {
|
---|
126 | name.value = [value];
|
---|
127 | nameSet = true;
|
---|
128 | } else {
|
---|
129 | throw new InvalidPropertyError('Invalid animation value at ' + formatPosition(value[2][0]) + '. Ignoring.');
|
---|
130 | }
|
---|
131 | }
|
---|
132 |
|
---|
133 | return components;
|
---|
134 | }
|
---|
135 |
|
---|
136 | function background(property, configuration, validator) {
|
---|
137 | var image = _wrapDefault('background-image', property, configuration);
|
---|
138 | var position = _wrapDefault('background-position', property, configuration);
|
---|
139 | var size = _wrapDefault('background-size', property, configuration);
|
---|
140 | var repeat = _wrapDefault('background-repeat', property, configuration);
|
---|
141 | var attachment = _wrapDefault('background-attachment', property, configuration);
|
---|
142 | var origin = _wrapDefault('background-origin', property, configuration);
|
---|
143 | var clip = _wrapDefault('background-clip', property, configuration);
|
---|
144 | var color = _wrapDefault('background-color', property, configuration);
|
---|
145 | var components = [image, position, size, repeat, attachment, origin, clip, color];
|
---|
146 | var values = property.value;
|
---|
147 |
|
---|
148 | var positionSet = false;
|
---|
149 | var clipSet = false;
|
---|
150 | var originSet = false;
|
---|
151 | var repeatSet = false;
|
---|
152 |
|
---|
153 | var anyValueSet = false;
|
---|
154 |
|
---|
155 | if (property.value.length == 1 && property.value[0][1] == 'inherit') {
|
---|
156 | // NOTE: 'inherit' is not a valid value for background-attachment
|
---|
157 | color.value = image.value = repeat.value = position.value = size.value = origin.value = clip.value = property.value;
|
---|
158 | return components;
|
---|
159 | }
|
---|
160 |
|
---|
161 | if (property.value.length == 1 && property.value[0][1] == '0 0') {
|
---|
162 | return components;
|
---|
163 | }
|
---|
164 |
|
---|
165 | for (var i = values.length - 1; i >= 0; i--) {
|
---|
166 | var value = values[i];
|
---|
167 |
|
---|
168 | if (validator.isBackgroundAttachmentKeyword(value[1])) {
|
---|
169 | attachment.value = [value];
|
---|
170 | anyValueSet = true;
|
---|
171 | } else if (validator.isBackgroundClipKeyword(value[1]) || validator.isBackgroundOriginKeyword(value[1])) {
|
---|
172 | if (clipSet) {
|
---|
173 | origin.value = [value];
|
---|
174 | originSet = true;
|
---|
175 | } else {
|
---|
176 | clip.value = [value];
|
---|
177 | clipSet = true;
|
---|
178 | }
|
---|
179 | anyValueSet = true;
|
---|
180 | } else if (validator.isBackgroundRepeatKeyword(value[1])) {
|
---|
181 | if (repeatSet) {
|
---|
182 | repeat.value.unshift(value);
|
---|
183 | } else {
|
---|
184 | repeat.value = [value];
|
---|
185 | repeatSet = true;
|
---|
186 | }
|
---|
187 | anyValueSet = true;
|
---|
188 | } else if (validator.isBackgroundPositionKeyword(value[1])
|
---|
189 | || validator.isBackgroundSizeKeyword(value[1])
|
---|
190 | || validator.isUnit(value[1])
|
---|
191 | || validator.isDynamicUnit(value[1])) {
|
---|
192 | if (i > 0) {
|
---|
193 | var previousValue = values[i - 1];
|
---|
194 |
|
---|
195 | if (previousValue[1] == Marker.FORWARD_SLASH) {
|
---|
196 | size.value = [value];
|
---|
197 | } else if (i > 1 && values[i - 2][1] == Marker.FORWARD_SLASH) {
|
---|
198 | size.value = [previousValue, value];
|
---|
199 | i -= 2;
|
---|
200 | } else {
|
---|
201 | if (!positionSet) { position.value = []; }
|
---|
202 |
|
---|
203 | position.value.unshift(value);
|
---|
204 | positionSet = true;
|
---|
205 | }
|
---|
206 | } else {
|
---|
207 | if (!positionSet) { position.value = []; }
|
---|
208 |
|
---|
209 | position.value.unshift(value);
|
---|
210 | positionSet = true;
|
---|
211 | }
|
---|
212 | anyValueSet = true;
|
---|
213 | } else if ((color.value[0][1] == configuration[color.name].defaultValue || color.value[0][1] == 'none') && (validator.isColor(value[1]) || validator.isPrefixed(value[1]))) {
|
---|
214 | color.value = [value];
|
---|
215 | anyValueSet = true;
|
---|
216 | } else if (validator.isUrl(value[1]) || validator.isFunction(value[1])) {
|
---|
217 | image.value = [value];
|
---|
218 | anyValueSet = true;
|
---|
219 | }
|
---|
220 | }
|
---|
221 |
|
---|
222 | if (clipSet && !originSet) { origin.value = clip.value.slice(0); }
|
---|
223 |
|
---|
224 | if (!anyValueSet) {
|
---|
225 | throw new InvalidPropertyError('Invalid background value at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
226 | }
|
---|
227 |
|
---|
228 | return components;
|
---|
229 | }
|
---|
230 |
|
---|
231 | function borderRadius(property, configuration) {
|
---|
232 | var values = property.value;
|
---|
233 | var splitAt = -1;
|
---|
234 |
|
---|
235 | for (var i = 0, l = values.length; i < l; i++) {
|
---|
236 | if (values[i][1] == Marker.FORWARD_SLASH) {
|
---|
237 | splitAt = i;
|
---|
238 | break;
|
---|
239 | }
|
---|
240 | }
|
---|
241 |
|
---|
242 | if (splitAt === 0 || splitAt === values.length - 1) {
|
---|
243 | throw new InvalidPropertyError('Invalid border-radius value at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
244 | }
|
---|
245 |
|
---|
246 | var target = _wrapDefault(property.name, property, configuration);
|
---|
247 | target.value = splitAt > -1
|
---|
248 | ? values.slice(0, splitAt)
|
---|
249 | : values.slice(0);
|
---|
250 | target.components = fourValues(target, configuration);
|
---|
251 |
|
---|
252 | var remainder = _wrapDefault(property.name, property, configuration);
|
---|
253 | remainder.value = splitAt > -1
|
---|
254 | ? values.slice(splitAt + 1)
|
---|
255 | : values.slice(0);
|
---|
256 | remainder.components = fourValues(remainder, configuration);
|
---|
257 |
|
---|
258 | for (var j = 0; j < 4; j++) {
|
---|
259 | target.components[j].multiplex = true;
|
---|
260 | target.components[j].value = target.components[j].value.concat(remainder.components[j].value);
|
---|
261 | }
|
---|
262 |
|
---|
263 | return target.components;
|
---|
264 | }
|
---|
265 |
|
---|
266 | function font(property, configuration, validator) {
|
---|
267 | var style = _wrapDefault('font-style', property, configuration);
|
---|
268 | var variant = _wrapDefault('font-variant', property, configuration);
|
---|
269 | var weight = _wrapDefault('font-weight', property, configuration);
|
---|
270 | var stretch = _wrapDefault('font-stretch', property, configuration);
|
---|
271 | var size = _wrapDefault('font-size', property, configuration);
|
---|
272 | var height = _wrapDefault('line-height', property, configuration);
|
---|
273 | var family = _wrapDefault('font-family', property, configuration);
|
---|
274 | var components = [style, variant, weight, stretch, size, height, family];
|
---|
275 | var values = property.value;
|
---|
276 | var fuzzyMatched = 4; // style, variant, weight, and stretch
|
---|
277 | var index = 0;
|
---|
278 | var isStretchSet = false;
|
---|
279 | var isStretchValid;
|
---|
280 | var isStyleSet = false;
|
---|
281 | var isStyleValid;
|
---|
282 | var isVariantSet = false;
|
---|
283 | var isVariantValid;
|
---|
284 | var isWeightSet = false;
|
---|
285 | var isWeightValid;
|
---|
286 | var appendableFamilyName = false;
|
---|
287 |
|
---|
288 | if (!values[index]) {
|
---|
289 | throw new InvalidPropertyError('Missing font values at ' + formatPosition(property.all[property.position][1][2][0]) + '. Ignoring.');
|
---|
290 | }
|
---|
291 |
|
---|
292 | if (values.length == 1 && values[0][1] == 'inherit') {
|
---|
293 | style.value = variant.value = weight.value = stretch.value = size.value = height.value = family.value = values;
|
---|
294 | return components;
|
---|
295 | }
|
---|
296 |
|
---|
297 | if (values.length == 1
|
---|
298 | && (validator.isFontKeyword(values[0][1])
|
---|
299 | || validator.isGlobal(values[0][1])
|
---|
300 | || validator.isPrefixed(values[0][1]))
|
---|
301 | ) {
|
---|
302 | values[0][1] = Marker.INTERNAL + values[0][1];
|
---|
303 | style.value = variant.value = weight.value = stretch.value = size.value = height.value = family.value = values;
|
---|
304 | return components;
|
---|
305 | }
|
---|
306 |
|
---|
307 | if (values.length < 2 || !_anyIsFontSize(values, validator) || !_anyIsFontFamily(values, validator)) {
|
---|
308 | throw new InvalidPropertyError('Invalid font values at ' + formatPosition(property.all[property.position][1][2][0]) + '. Ignoring.');
|
---|
309 | }
|
---|
310 |
|
---|
311 | if (values.length > 1 && _anyIsInherit(values)) {
|
---|
312 | throw new InvalidPropertyError('Invalid font values at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
313 | }
|
---|
314 |
|
---|
315 | // fuzzy match style, variant, weight, and stretch on first elements
|
---|
316 | while (index < fuzzyMatched) {
|
---|
317 | isStretchValid = validator.isFontStretchKeyword(values[index][1]) || validator.isGlobal(values[index][1]);
|
---|
318 | isStyleValid = validator.isFontStyleKeyword(values[index][1]) || validator.isGlobal(values[index][1]);
|
---|
319 | isVariantValid = validator.isFontVariantKeyword(values[index][1]) || validator.isGlobal(values[index][1]);
|
---|
320 | isWeightValid = validator.isFontWeightKeyword(values[index][1]) || validator.isGlobal(values[index][1]);
|
---|
321 |
|
---|
322 | if (isStyleValid && !isStyleSet) {
|
---|
323 | style.value = [values[index]];
|
---|
324 | isStyleSet = true;
|
---|
325 | } else if (isVariantValid && !isVariantSet) {
|
---|
326 | variant.value = [values[index]];
|
---|
327 | isVariantSet = true;
|
---|
328 | } else if (isWeightValid && !isWeightSet) {
|
---|
329 | weight.value = [values[index]];
|
---|
330 | isWeightSet = true;
|
---|
331 | } else if (isStretchValid && !isStretchSet) {
|
---|
332 | stretch.value = [values[index]];
|
---|
333 | isStretchSet = true;
|
---|
334 | } else if (isStyleValid
|
---|
335 | && isStyleSet
|
---|
336 | || isVariantValid
|
---|
337 | && isVariantSet
|
---|
338 | || isWeightValid
|
---|
339 | && isWeightSet
|
---|
340 | || isStretchValid
|
---|
341 | && isStretchSet) {
|
---|
342 | throw new InvalidPropertyError('Invalid font style / variant / weight / stretch value at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
343 | } else {
|
---|
344 | break;
|
---|
345 | }
|
---|
346 |
|
---|
347 | index++;
|
---|
348 | }
|
---|
349 |
|
---|
350 | // now comes font-size ...
|
---|
351 | if (validator.isFontSizeKeyword(values[index][1])
|
---|
352 | || validator.isUnit(values[index][1])
|
---|
353 | && !validator.isDynamicUnit(values[index][1])) {
|
---|
354 | size.value = [values[index]];
|
---|
355 | index++;
|
---|
356 | } else {
|
---|
357 | throw new InvalidPropertyError('Missing font size at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
358 | }
|
---|
359 |
|
---|
360 | if (!values[index]) {
|
---|
361 | throw new InvalidPropertyError('Missing font family at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
362 | }
|
---|
363 |
|
---|
364 | // ... and perhaps line-height
|
---|
365 | if (values[index]
|
---|
366 | && values[index][1] == Marker.FORWARD_SLASH
|
---|
367 | && values[index + 1]
|
---|
368 | && (validator.isLineHeightKeyword(values[index + 1][1])
|
---|
369 | || validator.isUnit(values[index + 1][1])
|
---|
370 | || validator.isNumber(values[index + 1][1]))) {
|
---|
371 | height.value = [values[index + 1]];
|
---|
372 | index++;
|
---|
373 | index++;
|
---|
374 | }
|
---|
375 |
|
---|
376 | // ... and whatever comes next is font-family
|
---|
377 | family.value = [];
|
---|
378 |
|
---|
379 | while (values[index]) {
|
---|
380 | if (values[index][1] == Marker.COMMA) {
|
---|
381 | appendableFamilyName = false;
|
---|
382 | } else {
|
---|
383 | if (appendableFamilyName) {
|
---|
384 | family.value[family.value.length - 1][1] += Marker.SPACE + values[index][1];
|
---|
385 | } else {
|
---|
386 | family.value.push(values[index]);
|
---|
387 | }
|
---|
388 |
|
---|
389 | appendableFamilyName = true;
|
---|
390 | }
|
---|
391 |
|
---|
392 | index++;
|
---|
393 | }
|
---|
394 |
|
---|
395 | if (family.value.length === 0) {
|
---|
396 | throw new InvalidPropertyError('Missing font family at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
397 | }
|
---|
398 |
|
---|
399 | return components;
|
---|
400 | }
|
---|
401 |
|
---|
402 | function _anyIsFontSize(values, validator) {
|
---|
403 | var value;
|
---|
404 | var i, l;
|
---|
405 |
|
---|
406 | for (i = 0, l = values.length; i < l; i++) {
|
---|
407 | value = values[i];
|
---|
408 |
|
---|
409 | if (validator.isFontSizeKeyword(value[1])
|
---|
410 | || validator.isUnit(value[1])
|
---|
411 | && !validator.isDynamicUnit(value[1])
|
---|
412 | || validator.isFunction(value[1])) {
|
---|
413 | return true;
|
---|
414 | }
|
---|
415 | }
|
---|
416 |
|
---|
417 | return false;
|
---|
418 | }
|
---|
419 |
|
---|
420 | function _anyIsFontFamily(values, validator) {
|
---|
421 | var value;
|
---|
422 | var i, l;
|
---|
423 |
|
---|
424 | for (i = 0, l = values.length; i < l; i++) {
|
---|
425 | value = values[i];
|
---|
426 |
|
---|
427 | if (validator.isIdentifier(value[1]) || validator.isQuotedText(value[1])) {
|
---|
428 | return true;
|
---|
429 | }
|
---|
430 | }
|
---|
431 |
|
---|
432 | return false;
|
---|
433 | }
|
---|
434 |
|
---|
435 | function fourValues(property, configuration) {
|
---|
436 | var componentNames = configuration[property.name].components;
|
---|
437 | var components = [];
|
---|
438 | var value = property.value;
|
---|
439 |
|
---|
440 | if (value.length < 1) { return []; }
|
---|
441 |
|
---|
442 | if (value.length < 2) { value[1] = value[0].slice(0); }
|
---|
443 | if (value.length < 3) { value[2] = value[0].slice(0); }
|
---|
444 | if (value.length < 4) { value[3] = value[1].slice(0); }
|
---|
445 |
|
---|
446 | for (var i = componentNames.length - 1; i >= 0; i--) {
|
---|
447 | var component = wrapSingle([
|
---|
448 | Token.PROPERTY,
|
---|
449 | [Token.PROPERTY_NAME, componentNames[i]]
|
---|
450 | ]);
|
---|
451 | component.value = [value[i]];
|
---|
452 | components.unshift(component);
|
---|
453 | }
|
---|
454 |
|
---|
455 | return components;
|
---|
456 | }
|
---|
457 |
|
---|
458 | function multiplex(splitWith) {
|
---|
459 | return function(property, configuration, validator) {
|
---|
460 | var splitsAt = [];
|
---|
461 | var values = property.value;
|
---|
462 | var i, j, l, m;
|
---|
463 |
|
---|
464 | // find split commas
|
---|
465 | for (i = 0, l = values.length; i < l; i++) {
|
---|
466 | if (values[i][1] == ',') { splitsAt.push(i); }
|
---|
467 | }
|
---|
468 |
|
---|
469 | if (splitsAt.length === 0) { return splitWith(property, configuration, validator); }
|
---|
470 |
|
---|
471 | var splitComponents = [];
|
---|
472 |
|
---|
473 | // split over commas, and into components
|
---|
474 | for (i = 0, l = splitsAt.length; i <= l; i++) {
|
---|
475 | var from = i === 0 ? 0 : splitsAt[i - 1] + 1;
|
---|
476 | var to = i < l ? splitsAt[i] : values.length;
|
---|
477 |
|
---|
478 | var _property = _wrapDefault(property.name, property, configuration);
|
---|
479 | _property.value = values.slice(from, to);
|
---|
480 |
|
---|
481 | if (_property.value.length > 0) {
|
---|
482 | splitComponents.push(splitWith(_property, configuration, validator));
|
---|
483 | }
|
---|
484 | }
|
---|
485 |
|
---|
486 | var components = splitComponents[0];
|
---|
487 |
|
---|
488 | // group component values from each split
|
---|
489 | for (i = 0, l = components.length; i < l; i++) {
|
---|
490 | components[i].multiplex = true;
|
---|
491 |
|
---|
492 | for (j = 1, m = splitComponents.length; j < m; j++) {
|
---|
493 | components[i].value.push([Token.PROPERTY_VALUE, Marker.COMMA]);
|
---|
494 | Array.prototype.push.apply(components[i].value, splitComponents[j][i].value);
|
---|
495 | }
|
---|
496 | }
|
---|
497 |
|
---|
498 | return components;
|
---|
499 | };
|
---|
500 | }
|
---|
501 |
|
---|
502 | function listStyle(property, configuration, validator) {
|
---|
503 | var type = _wrapDefault('list-style-type', property, configuration);
|
---|
504 | var position = _wrapDefault('list-style-position', property, configuration);
|
---|
505 | var image = _wrapDefault('list-style-image', property, configuration);
|
---|
506 | var components = [type, position, image];
|
---|
507 |
|
---|
508 | if (property.value.length == 1 && property.value[0][1] == 'inherit') {
|
---|
509 | type.value = position.value = image.value = [property.value[0]];
|
---|
510 | return components;
|
---|
511 | }
|
---|
512 |
|
---|
513 | var values = property.value.slice(0);
|
---|
514 | var total = values.length;
|
---|
515 | var index = 0;
|
---|
516 |
|
---|
517 | // `image` first...
|
---|
518 | for (index = 0, total = values.length; index < total; index++) {
|
---|
519 | if (validator.isUrl(values[index][1]) || values[index][1] == '0') {
|
---|
520 | image.value = [values[index]];
|
---|
521 | values.splice(index, 1);
|
---|
522 | break;
|
---|
523 | }
|
---|
524 | }
|
---|
525 |
|
---|
526 | // ... then `position`
|
---|
527 | for (index = 0, total = values.length; index < total; index++) {
|
---|
528 | if (validator.isListStylePositionKeyword(values[index][1])) {
|
---|
529 | position.value = [values[index]];
|
---|
530 | values.splice(index, 1);
|
---|
531 | break;
|
---|
532 | }
|
---|
533 | }
|
---|
534 |
|
---|
535 | // ... and what's left is a `type`
|
---|
536 | if (values.length > 0 && (validator.isListStyleTypeKeyword(values[0][1]) || validator.isIdentifier(values[0][1]))) {
|
---|
537 | type.value = [values[0]];
|
---|
538 | }
|
---|
539 |
|
---|
540 | return components;
|
---|
541 | }
|
---|
542 |
|
---|
543 | function transition(property, configuration, validator) {
|
---|
544 | var prop = _wrapDefault(property.name + '-property', property, configuration);
|
---|
545 | var duration = _wrapDefault(property.name + '-duration', property, configuration);
|
---|
546 | var timing = _wrapDefault(property.name + '-timing-function', property, configuration);
|
---|
547 | var delay = _wrapDefault(property.name + '-delay', property, configuration);
|
---|
548 | var components = [prop, duration, timing, delay];
|
---|
549 | var values = property.value;
|
---|
550 | var value;
|
---|
551 | var durationSet = false;
|
---|
552 | var delaySet = false;
|
---|
553 | var propSet = false;
|
---|
554 | var timingSet = false;
|
---|
555 | var i;
|
---|
556 | var l;
|
---|
557 |
|
---|
558 | if (property.value.length == 1 && property.value[0][1] == 'inherit') {
|
---|
559 | prop.value = duration.value = timing.value = delay.value = property.value;
|
---|
560 | return components;
|
---|
561 | }
|
---|
562 |
|
---|
563 | if (values.length > 1 && _anyIsInherit(values)) {
|
---|
564 | throw new InvalidPropertyError('Invalid animation values at ' + formatPosition(values[0][2][0]) + '. Ignoring.');
|
---|
565 | }
|
---|
566 |
|
---|
567 | for (i = 0, l = values.length; i < l; i++) {
|
---|
568 | value = values[i];
|
---|
569 |
|
---|
570 | if (validator.isTime(value[1]) && !durationSet) {
|
---|
571 | duration.value = [value];
|
---|
572 | durationSet = true;
|
---|
573 | } else if (validator.isTime(value[1]) && !delaySet) {
|
---|
574 | delay.value = [value];
|
---|
575 | delaySet = true;
|
---|
576 | } else if ((validator.isGlobal(value[1]) || validator.isTimingFunction(value[1])) && !timingSet) {
|
---|
577 | timing.value = [value];
|
---|
578 | timingSet = true;
|
---|
579 | } else if (validator.isIdentifier(value[1]) && !propSet) {
|
---|
580 | prop.value = [value];
|
---|
581 | propSet = true;
|
---|
582 | } else {
|
---|
583 | throw new InvalidPropertyError('Invalid animation value at ' + formatPosition(value[2][0]) + '. Ignoring.');
|
---|
584 | }
|
---|
585 | }
|
---|
586 |
|
---|
587 | return components;
|
---|
588 | }
|
---|
589 |
|
---|
590 | function widthStyleColor(property, configuration, validator) {
|
---|
591 | var descriptor = configuration[property.name];
|
---|
592 | var components = [
|
---|
593 | _wrapDefault(descriptor.components[0], property, configuration),
|
---|
594 | _wrapDefault(descriptor.components[1], property, configuration),
|
---|
595 | _wrapDefault(descriptor.components[2], property, configuration)
|
---|
596 | ];
|
---|
597 | var color, style, width;
|
---|
598 |
|
---|
599 | for (var i = 0; i < 3; i++) {
|
---|
600 | var component = components[i];
|
---|
601 |
|
---|
602 | if (component.name.indexOf('color') > 0) { color = component; } else if (component.name.indexOf('style') > 0) { style = component; } else { width = component; }
|
---|
603 | }
|
---|
604 |
|
---|
605 | if ((property.value.length == 1 && property.value[0][1] == 'inherit')
|
---|
606 | || (property.value.length == 3 && property.value[0][1] == 'inherit' && property.value[1][1] == 'inherit' && property.value[2][1] == 'inherit')) {
|
---|
607 | color.value = style.value = width.value = [property.value[0]];
|
---|
608 | return components;
|
---|
609 | }
|
---|
610 |
|
---|
611 | var values = property.value.slice(0);
|
---|
612 | var match, matches;
|
---|
613 |
|
---|
614 | // NOTE: usually users don't follow the required order of parts in this shorthand,
|
---|
615 | // so we'll try to parse it caring as little about order as possible
|
---|
616 |
|
---|
617 | if (values.length > 0) {
|
---|
618 | matches = values.filter(_widthFilter(validator));
|
---|
619 | match = matches.length > 1 && (matches[0][1] == 'none' || matches[0][1] == 'auto') ? matches[1] : matches[0];
|
---|
620 | if (match) {
|
---|
621 | width.value = [match];
|
---|
622 | values.splice(values.indexOf(match), 1);
|
---|
623 | }
|
---|
624 | }
|
---|
625 |
|
---|
626 | if (values.length > 0) {
|
---|
627 | match = values.filter(_styleFilter(validator))[0];
|
---|
628 | if (match) {
|
---|
629 | style.value = [match];
|
---|
630 | values.splice(values.indexOf(match), 1);
|
---|
631 | }
|
---|
632 | }
|
---|
633 |
|
---|
634 | if (values.length > 0) {
|
---|
635 | match = values.filter(_colorFilter(validator))[0];
|
---|
636 | if (match) {
|
---|
637 | color.value = [match];
|
---|
638 | values.splice(values.indexOf(match), 1);
|
---|
639 | }
|
---|
640 | }
|
---|
641 |
|
---|
642 | return components;
|
---|
643 | }
|
---|
644 |
|
---|
645 | module.exports = {
|
---|
646 | animation: animation,
|
---|
647 | background: background,
|
---|
648 | border: widthStyleColor,
|
---|
649 | borderRadius: borderRadius,
|
---|
650 | font: font,
|
---|
651 | fourValues: fourValues,
|
---|
652 | listStyle: listStyle,
|
---|
653 | multiplex: multiplex,
|
---|
654 | outline: widthStyleColor,
|
---|
655 | transition: transition
|
---|
656 | };
|
---|