123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368 |
- (function() {
- var Gradient, OldValue, Value, isDirection, list, parser, range, utils,
- extend = function(child, parent) { for (var key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; },
- hasProp = {}.hasOwnProperty,
- slice = [].slice;
- OldValue = require('../old-value');
- Value = require('../value');
- utils = require('../utils');
- parser = require('postcss-value-parser');
- range = require('normalize-range');
- list = require('postcss/lib/list');
- isDirection = /top|left|right|bottom/gi;
- Gradient = (function(superClass) {
- extend(Gradient, superClass);
- function Gradient() {
- return Gradient.__super__.constructor.apply(this, arguments);
- }
- Gradient.names = ['linear-gradient', 'repeating-linear-gradient', 'radial-gradient', 'repeating-radial-gradient'];
- Gradient.prototype.replace = function(string, prefix) {
- var ast, changes, j, len, node, ref;
- ast = parser(string);
- ref = ast.nodes;
- for (j = 0, len = ref.length; j < len; j++) {
- node = ref[j];
- if (node.type === 'function' && node.value === this.name) {
- node.nodes = this.newDirection(node.nodes);
- node.nodes = this.normalize(node.nodes);
- if (prefix === '-webkit- old') {
- changes = this.oldWebkit(node);
- if (!changes) {
- return;
- }
- } else {
- node.nodes = this.convertDirection(node.nodes);
- node.value = prefix + node.value;
- }
- }
- }
- return ast.toString();
- };
- Gradient.prototype.directions = {
- top: 'bottom',
- left: 'right',
- bottom: 'top',
- right: 'left'
- };
- Gradient.prototype.oldDirections = {
- 'top': 'left bottom, left top',
- 'left': 'right top, left top',
- 'bottom': 'left top, left bottom',
- 'right': 'left top, right top',
- 'top right': 'left bottom, right top',
- 'top left': 'right bottom, left top',
- 'right top': 'left bottom, right top',
- 'right bottom': 'left top, right bottom',
- 'bottom right': 'left top, right bottom',
- 'bottom left': 'right top, left bottom',
- 'left top': 'right bottom, left top',
- 'left bottom': 'right top, left bottom'
- };
- Gradient.prototype.replaceFirst = function() {
- var params, prefix, words;
- params = arguments[0], words = 2 <= arguments.length ? slice.call(arguments, 1) : [];
- prefix = words.map(function(i) {
- if (i === ' ') {
- return {
- type: 'space',
- value: i
- };
- } else {
- return {
- type: 'word',
- value: i
- };
- }
- });
- return prefix.concat(params.slice(1));
- };
- Gradient.prototype.normalizeUnit = function(str, full) {
- var deg, num;
- num = parseFloat(str);
- deg = (num / full) * 360;
- return deg + "deg";
- };
- Gradient.prototype.normalize = function(nodes) {
- var num;
- if (!nodes[0]) {
- return nodes;
- }
- if (/-?\d+(.\d+)?grad/.test(nodes[0].value)) {
- nodes[0].value = this.normalizeUnit(nodes[0].value, 400);
- } else if (/-?\d+(.\d+)?rad/.test(nodes[0].value)) {
- nodes[0].value = this.normalizeUnit(nodes[0].value, 2 * Math.PI);
- } else if (/-?\d+(.\d+)?turn/.test(nodes[0].value)) {
- nodes[0].value = this.normalizeUnit(nodes[0].value, 1);
- } else if (nodes[0].value.indexOf('deg') !== -1) {
- num = parseFloat(nodes[0].value);
- num = range.wrap(0, 360, num);
- nodes[0].value = num + "deg";
- }
- if (nodes[0].value === '0deg') {
- nodes = this.replaceFirst(nodes, 'to', ' ', 'top');
- } else if (nodes[0].value === '90deg') {
- nodes = this.replaceFirst(nodes, 'to', ' ', 'right');
- } else if (nodes[0].value === '180deg') {
- nodes = this.replaceFirst(nodes, 'to', ' ', 'bottom');
- } else if (nodes[0].value === '270deg') {
- nodes = this.replaceFirst(nodes, 'to', ' ', 'left');
- }
- return nodes;
- };
- Gradient.prototype.newDirection = function(params) {
- var i, j, ref;
- if (params[0].value === 'to') {
- return params;
- }
- if (!isDirection.test(params[0].value)) {
- return params;
- }
- params.unshift({
- type: 'word',
- value: 'to'
- }, {
- type: 'space',
- value: ' '
- });
- for (i = j = 2, ref = params.length; 2 <= ref ? j < ref : j > ref; i = 2 <= ref ? ++j : --j) {
- if (params[i].type === 'div') {
- break;
- }
- if (params[i].type === 'word') {
- params[i].value = this.revertDirection(params[i].value);
- }
- }
- return params;
- };
- Gradient.prototype.convertDirection = function(params) {
- if (params.length > 0) {
- if (params[0].value === 'to') {
- this.fixDirection(params);
- } else if (params[0].value.indexOf('deg') !== -1) {
- this.fixAngle(params);
- } else if (params[2].value === 'at') {
- this.fixRadial(params);
- }
- }
- return params;
- };
- Gradient.prototype.fixDirection = function(params) {
- var i, j, ref, results;
- params.splice(0, 2);
- results = [];
- for (i = j = 0, ref = params.length; 0 <= ref ? j < ref : j > ref; i = 0 <= ref ? ++j : --j) {
- if (params[i].type === 'div') {
- break;
- }
- if (params[i].type === 'word') {
- results.push(params[i].value = this.revertDirection(params[i].value));
- } else {
- results.push(void 0);
- }
- }
- return results;
- };
- Gradient.prototype.fixAngle = function(params) {
- var first;
- first = params[0].value;
- first = parseFloat(first);
- first = Math.abs(450 - first) % 360;
- first = this.roundFloat(first, 3);
- return params[0].value = first + "deg";
- };
- Gradient.prototype.fixRadial = function(params) {
- var first, i, j, ref, second;
- first = params[0];
- second = [];
- for (i = j = 4, ref = params.length; 4 <= ref ? j < ref : j > ref; i = 4 <= ref ? ++j : --j) {
- if (params[i].type === 'div') {
- break;
- } else {
- second.push(params[i]);
- }
- }
- return params.splice.apply(params, [0, i].concat(slice.call(second), [params[i + 2]], [first]));
- };
- Gradient.prototype.revertDirection = function(word) {
- return this.directions[word.toLowerCase()] || word;
- };
- Gradient.prototype.roundFloat = function(float, digits) {
- return parseFloat(float.toFixed(digits));
- };
- Gradient.prototype.oldWebkit = function(node) {
- var i, j, k, len, len1, nodes, param, params, string;
- nodes = node.nodes;
- string = parser.stringify(node.nodes);
- if (this.name !== 'linear-gradient') {
- return false;
- }
- if (nodes[0] && nodes[0].value.indexOf('deg') !== -1) {
- return false;
- }
- if (string.indexOf('px') !== -1) {
- return false;
- }
- if (string.indexOf('-corner') !== -1) {
- return false;
- }
- if (string.indexOf('-side') !== -1) {
- return false;
- }
- params = [[]];
- for (j = 0, len = nodes.length; j < len; j++) {
- i = nodes[j];
- params[params.length - 1].push(i);
- if (i.type === 'div' && i.value === ',') {
- params.push([]);
- }
- }
- this.oldDirection(params);
- this.colorStops(params);
- node.nodes = [];
- for (k = 0, len1 = params.length; k < len1; k++) {
- param = params[k];
- node.nodes = node.nodes.concat(param);
- }
- node.nodes.unshift({
- type: 'word',
- value: 'linear'
- }, this.cloneDiv(node.nodes));
- node.value = '-webkit-gradient';
- return true;
- };
- Gradient.prototype.oldDirection = function(params) {
- var div, j, len, node, old, ref, words;
- div = this.cloneDiv(params[0]);
- if (params[0][0].value !== 'to') {
- return params.unshift([
- {
- type: 'word',
- value: this.oldDirections.bottom
- }, div
- ]);
- } else {
- words = [];
- ref = params[0].slice(2);
- for (j = 0, len = ref.length; j < len; j++) {
- node = ref[j];
- if (node.type === 'word') {
- words.push(node.value.toLowerCase());
- }
- }
- words = words.join(' ');
- old = this.oldDirections[words] || words;
- return params[0] = [
- {
- type: 'word',
- value: old
- }, div
- ];
- }
- };
- Gradient.prototype.cloneDiv = function(params) {
- var i, j, len;
- for (j = 0, len = params.length; j < len; j++) {
- i = params[j];
- if (i.type === 'div' && i.value === ',') {
- return i;
- }
- }
- return {
- type: 'div',
- value: ',',
- after: ' '
- };
- };
- Gradient.prototype.colorStops = function(params) {
- var color, div, i, j, len, param, pos, results, stop;
- results = [];
- for (i = j = 0, len = params.length; j < len; i = ++j) {
- param = params[i];
- if (i === 0) {
- continue;
- }
- color = parser.stringify(param[0]);
- if (param[1] && param[1].type === 'word') {
- pos = param[1].value;
- } else if (param[2] && param[2].type === 'word') {
- pos = param[2].value;
- }
- stop = i === 1 && (!pos || pos === '0%') ? "from(" + color + ")" : i === params.length - 1 && (!pos || pos === '100%') ? "to(" + color + ")" : pos ? "color-stop(" + pos + ", " + color + ")" : "color-stop(" + color + ")";
- div = param[param.length - 1];
- params[i] = [
- {
- type: 'word',
- value: stop
- }
- ];
- if (div.type === 'div' && div.value === ',') {
- results.push(params[i].push(div));
- } else {
- results.push(void 0);
- }
- }
- return results;
- };
- Gradient.prototype.old = function(prefix) {
- var regexp, string, type;
- if (prefix === '-webkit-') {
- type = this.name === 'linear-gradient' ? 'linear' : 'radial';
- string = '-gradient';
- regexp = utils.regexp("-webkit-(" + type + "-gradient|gradient\\(\\s*" + type + ")", false);
- return new OldValue(this.name, prefix + this.name, string, regexp);
- } else {
- return Gradient.__super__.old.apply(this, arguments);
- }
- };
- Gradient.prototype.add = function(decl, prefix) {
- var p;
- p = decl.prop;
- if (p.indexOf('mask') !== -1) {
- if (prefix === '-webkit-' || prefix === '-webkit- old') {
- return Gradient.__super__.add.apply(this, arguments);
- }
- } else if (p === 'list-style' || p === 'list-style-image' || p === 'content') {
- if (prefix === '-webkit-' || prefix === '-webkit- old') {
- return Gradient.__super__.add.apply(this, arguments);
- }
- } else {
- return Gradient.__super__.add.apply(this, arguments);
- }
- };
- return Gradient;
- })(Value);
- module.exports = Gradient;
- }).call(this);
|