[79a0317] | 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 | };
|
---|