Add support for direction without "to"

I tried running this plugin on a codebase with some old, vendored code
in it, and ran into an error when trying to parse a style like the
following:

  background: linear-gradient(top, #f00, #00f);

To fix this and generate the expected gradients, I needed to modify the
side corner regex to take the presence or absence of "to" into account
and then modify the direction if it was not there.

Author: lencioni

index.js

@@ -18,17 +18,19 @@ function parseGradient(str) {
     // `top right` and `right top` are the same,
     // so we should put this situation into consideration
     var rSideCorner = new RegExp(
-      'to\\s+' +
       '(' + // 1
-          '(?:left|right|top|bottom)' +
-          '|' +
+          '(?:to\\s+)?' +
           '(?:' +
-              '(?:' + // left top, left bottom, right top, right bottom
-                  '(?:left|right)\\s+(?:top|bottom)' +
-              ')' +
+              '(?:left|right|top|bottom)' +
               '|' +
-              '(?:' + // top left, top right, bottom left, bottom right
-                  '(?:top|bottom)\\s+(?:left|right)' +
+              '(?:' +
+                  '(?:' + // left top, left bottom, right top, right bottom
+                      '(?:left|right)\\s+(?:top|bottom)' +
+                  ')' +
+                  '|' +
+                  '(?:' + // top left, top right, bottom left, bottom right
+                      '(?:top|bottom)\\s+(?:left|right)' +
+                  ')' +
               ')' +
           ')' +
       ')' + // end 1
@@ -42,7 +44,7 @@ function parseGradient(str) {
     var rGradientLine = new RegExp('^\\s*' + rAngle.source + '|' + rSideCorner.source, 'i');
     /* eslint-enable max-len */
 
-    var position = str.match(rGradientLine) || ['', null, 'deg', 'bottom'];
+    var position = str.match(rGradientLine) || ['', null, 'deg', 'to bottom'];
     var angle = position[1];
     var sideCorner = position[3];
     var unit = position[2];
@@ -122,8 +124,27 @@ function getDirection(gradient) {
 
     if (gradient.sideCorner) {
         segs = gradient.sideCorner.split(/\s+/);
+
+        var to = segs[0] === 'to';
+        if (to) {
+            // sideCorner starts with "to" so we shift it off since we don't
+          // need this element anymore, and continue with generating the
+          // gradient in the normal direction.
+            segs.shift();
+        } else {
+            // sideCorner does not start with "to", so we need to reverse the
+            // direction.
+            var reverseDirections = {
+                top: 'bottom',
+                bottom: 'top',
+                left: 'right',
+                right: 'left'
+            };
+            segs[0] = reverseDirections[segs[0]];
+        }
+
         result.direction = segs[0];
-        // side corner is  `top right` or `bottm left` etc.
+        // side corner is  `top right` or `bottom left` etc.
         if (segs.length > 1) {
             // fallback to one direction
             result.isFallback = true;

test/fixtures/bottom.css

@@ -0,0 +1,3 @@
+a {
+    background: linear-gradient(bottom, #1E5799, #7DB9E8);
+}

test/fixtures/bottom.expect.css

@@ -0,0 +1,4 @@
+a {
+    background: linear-gradient(bottom, #1E5799, #7DB9E8);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff7db9e8', endColorstr='#ff1e5799', GradientType=0);
+}

test/fixtures/left.css

@@ -0,0 +1,3 @@
+a {
+    background: linear-gradient(left, #1E5799, #7DB9E8);
+}

test/fixtures/left.expect.css

@@ -0,0 +1,4 @@
+a {
+    background: linear-gradient(left, #1E5799, #7DB9E8);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1e5799', endColorstr='#ff7db9e8', GradientType=1);
+}

test/fixtures/right.css

@@ -0,0 +1,3 @@
+a {
+    background: linear-gradient(right, #1E5799, #7DB9E8);
+}

test/fixtures/right.expect.css

@@ -0,0 +1,4 @@
+a {
+    background: linear-gradient(right, #1E5799, #7DB9E8);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff7db9e8', endColorstr='#ff1e5799', GradientType=1);
+}

test/fixtures/top.css

@@ -0,0 +1,3 @@
+a {
+    background: linear-gradient(top, #1E5799, #7DB9E8);
+}

test/fixtures/top.expect.css

@@ -0,0 +1,4 @@
+a {
+    background: linear-gradient(top, #1E5799, #7DB9E8);
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1e5799', endColorstr='#ff7db9e8', GradientType=0);
+}

test/test.js

@@ -50,10 +50,26 @@ describe('postcss-filter-gradient', function () {
         test('simple', {}, done);
     });
 
+    it('should support top', function (done) {
+        test('top', {}, done);
+    });
+
+    it('should support bottom', function (done) {
+        test('bottom', {}, done);
+    });
+
     it('should support vertical reverse', function (done) {
         test('vertical-reverse', {}, done);
     });
 
+    it('should support right', function (done) {
+        test('right', {}, done);
+    });
+
+    it('should support left', function (done) {
+        test('left', {}, done);
+    });
+
     it('should support horizontal direction', function (done) {
         test('horizontal', {}, done);
     });