apply translate when evaluating feature expr

src/renderer/plugins/ohm/path-template.js

@@ -2,6 +2,7 @@ import isObject from 'lodash/isObject'
 import zip from 'lodash/zip'
 import ohm from 'ohm-js'
 import { Path, Point } from 'paper/dist/paper-core'
+import { kForOnEventAttribute } from 'ws/lib/constants'
 
 import PathTemplateGrammar from './path-template.ohm'
 
@@ -160,9 +161,9 @@ export function createSemantics (loader, artwork) {
         }
 
         const [id, rotKey] = ref.split('@')
-        let feature = loader.features[id]
+        const root = loader.features[id]
+        let feature = root
         if (rotKey !== undefined) {
-          // TODO clip can be on parent, also clip-rotate may be used
           feature = feature['@' + rotKey]
         }
 
@@ -171,7 +172,7 @@ export function createSemantics (loader, artwork) {
           return ''
         }
 
-        const { clip } = feature
+        let clip = feature.clip || root.clip || feature['clip-rotate']
         if (isObject(clip)) {
           // https://stackoverflow.com/questions/5737975/circle-drawing-with-svgs-arc-path
           if (clip.shape === 'circle') {
@@ -186,6 +187,16 @@ export function createSemantics (loader, artwork) {
           return ''
         }
 
+        if (feature.transform) {
+          clip = asPath(clip)
+          const m = /translate\((-?\d+),\s*(-?\d+)\)/.exec(feature.transform)
+          if (m) {
+            clip = clip.translate(new Point(~~m[1], ~~m[2]))
+          } else {
+            console.error(`unimplemented transform (when rerefenced as ${ref}`)
+          }
+        }
+
         return clip
       }
     })