From d86f9cdb9736a88fcb58bc3aff7c959b14add201 Mon Sep 17 00:00:00 2001
From: "Johannes J. Schmidt" <schmidt@netzmerk.com>
Date: Mon, 16 Sep 2013 13:14:15 +0200
Subject: [PATCH] Relax keyframe selectors and property names

Support Skrollr Stylesheets, allow
* numerical keyframes-selectors
* generic alphanumeric keyframes-selectors (`top`)
* propertys with `[word]`
---
 index.js                           |   4 +-
 test/cases/keyframes.advanced.css  |  13 +++
 test/cases/keyframes.advanced.json | 122 +++++++++++++++++++++++++++++
 3 files changed, 137 insertions(+), 2 deletions(-)
 create mode 100644 test/cases/keyframes.advanced.css
 create mode 100644 test/cases/keyframes.advanced.json

diff --git a/index.js b/index.js
index 944865b..5572b9f 100644
--- a/index.js
+++ b/index.js
@@ -179,7 +179,7 @@ module.exports = function(css, options){
     var pos = position();
 
     // prop
-    var prop = match(/^(\*?[-\/\*\w]+)\s*/);
+    var prop = match(/^(\*?[-\/\*\w]+(\[[0-9a-z_-]+\])?)\s*/);
     if (!prop) return;
     prop = trim(prop[0]);
 
@@ -232,7 +232,7 @@ module.exports = function(css, options){
     var vals = [];
     var pos = position();
 
-    while (m = match(/^(from|to|\d+%|\.\d+%|\d+\.\d+%)\s*/)) {
+    while (m = match(/^((\d+\.\d+|\.\d+|\d+)%{0,1}|[a-z]+)\s*/)) {
       vals.push(m[1]);
       match(/^,\s*/);
     }
diff --git a/test/cases/keyframes.advanced.css b/test/cases/keyframes.advanced.css
new file mode 100644
index 0000000..c509a11
--- /dev/null
+++ b/test/cases/keyframes.advanced.css
@@ -0,0 +1,13 @@
+@keyframes advanced {
+  top {
+    opacity[sqrt]: 0;
+  }
+
+  100 {
+    opacity: 0.5;
+  }
+
+  bottom {
+    opacity: 1;
+  }
+}
diff --git a/test/cases/keyframes.advanced.json b/test/cases/keyframes.advanced.json
new file mode 100644
index 0000000..6cc8e35
--- /dev/null
+++ b/test/cases/keyframes.advanced.json
@@ -0,0 +1,122 @@
+{
+  "type": "stylesheet",
+  "stylesheet": {
+    "rules": [
+      {
+        "type": "keyframes",
+        "name": "advanced",
+        "keyframes": [
+          {
+            "type": "keyframe",
+            "values": [
+              "top"
+            ],
+            "declarations": [
+              {
+                "type": "declaration",
+                "property": "opacity[sqrt]",
+                "value": "0",
+                "position": {
+                  "start": {
+                    "line": 3,
+                    "column": 5
+                  },
+                  "end": {
+                    "line": 3,
+                    "column": 21
+                  }
+                }
+              }
+            ],
+            "position": {
+              "start": {
+                "line": 2,
+                "column": 3
+              },
+              "end": {
+                "line": 4,
+                "column": 4
+              }
+            }
+          },
+          {
+            "type": "keyframe",
+            "values": [
+              "100"
+            ],
+            "declarations": [
+              {
+                "type": "declaration",
+                "property": "opacity",
+                "value": "0.5",
+                "position": {
+                  "start": {
+                    "line": 7,
+                    "column": 5
+                  },
+                  "end": {
+                    "line": 7,
+                    "column": 17
+                  }
+                }
+              }
+            ],
+            "position": {
+              "start": {
+                "line": 6,
+                "column": 3
+              },
+              "end": {
+                "line": 8,
+                "column": 4
+              }
+            }
+          },
+          {
+            "type": "keyframe",
+            "values": [
+              "bottom"
+            ],
+            "declarations": [
+              {
+                "type": "declaration",
+                "property": "opacity",
+                "value": "1",
+                "position": {
+                  "start": {
+                    "line": 11,
+                    "column": 5
+                  },
+                  "end": {
+                    "line": 11,
+                    "column": 15
+                  }
+                }
+              }
+            ],
+            "position": {
+              "start": {
+                "line": 10,
+                "column": 3
+              },
+              "end": {
+                "line": 12,
+                "column": 4
+              }
+            }
+          }
+        ],
+        "position": {
+          "start": {
+            "line": 1,
+            "column": 1
+          },
+          "end": {
+            "line": 13,
+            "column": 2
+          }
+        }
+      }
+    ]
+  }
+}
\ No newline at end of file