From ed2c26c39e8cfda13849ba5af829384964d09ea4 Mon Sep 17 00:00:00 2001
From: Jeff Avallone <jeff.avallone@gmail.com>
Date: Sun, 30 Nov 2014 15:36:53 -0500
Subject: [PATCH] Adding basic code to render stand and end indicators

---
 src/index.html                       |  6 +++++
 src/js/main.js                       | 14 +++--------
 src/js/parser/javascript/base.js     | 11 +++++++++
 src/js/parser/javascript/grammar.peg |  2 +-
 src/js/parser/javascript/root.js     | 36 +++++++++++++++++++++-------
 5 files changed, 49 insertions(+), 20 deletions(-)

diff --git a/src/index.html b/src/index.html
index be4b1c4..6c53ef4 100644
--- a/src/index.html
+++ b/src/index.html
@@ -28,6 +28,12 @@
           dominant-baseline: text-after-edge;
         }
 
+        circle.anchor {
+          fill: #6b6659;
+          stroke-width: 2px;
+          stroke: #000;
+        }
+
         .placeholder text {
           fill: #fff;
           font-weight: bold;
diff --git a/src/js/main.js b/src/js/main.js
index 6f31c34..d5f2df0 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -19,20 +19,12 @@ import Snap from 'snapsvg';
       result.position();
 
       container.transform(Snap.matrix()
-        .translate(5, 5));
+        .translate(10, 10));
 
       box = container.getBBox();
       svg.attr({
-        width: box.width + 10,
-        height: box.height + 10
-      });
-
-      svg.rect().attr({
-        'class': 'bounding-box',
-        x: box.x,
-        y: box.y,
-        width: box.width,
-        height: box.height
+        width: box.width + 20,
+        height: box.height + 20
       });
     });
   }
diff --git a/src/js/parser/javascript/base.js b/src/js/parser/javascript/base.js
index f05a360..cb3c254 100644
--- a/src/js/parser/javascript/base.js
+++ b/src/js/parser/javascript/base.js
@@ -29,6 +29,17 @@ export default {
     });
   },
 
+  render_bbox(container, box) {
+    container.rect()
+      .attr({
+        'class': 'bounding-box',
+        width: box.width,
+        height: box.height
+      })
+      .transform(Snap.matrix()
+        .translate(box.x, box.y));
+  },
+
   render(container) {
     container.attr({ 'class': 'placeholder' });
 
diff --git a/src/js/parser/javascript/grammar.peg b/src/js/parser/javascript/grammar.peg
index 79a023c..c8a019f 100644
--- a/src/js/parser/javascript/grammar.peg
+++ b/src/js/parser/javascript/grammar.peg
@@ -1,5 +1,5 @@
 grammar JavascriptRegexp
-  root <- ( ( "/" regexp "/" fl:[igm]* ) / regexp ) <Root>
+  root <- ( ( "/" regexp "/" fl:[igm]* ) / regexp ""? ) <Root>
   regexp <- match ( "|" match )* <Regexp>
   match <- anchor_start? ( ( subexp / charset / terminal ) repeat? )* anchor_end?
   anchor_start <- "^"
diff --git a/src/js/parser/javascript/root.js b/src/js/parser/javascript/root.js
index 2c53ff9..3969101 100644
--- a/src/js/parser/javascript/root.js
+++ b/src/js/parser/javascript/root.js
@@ -2,6 +2,34 @@ import _ from 'lodash';
 import Base from './base.js';
 
 export default _.extend({}, Base, {
+  render(container) {
+    this.contents = container.group();
+
+    this.regexp.render(this.contents);
+
+    this.start = container.circle().attr({
+      r: 5,
+      'class': 'anchor'
+    });
+    this.end = container.circle().attr({
+      r: 5,
+      'class': 'anchor'
+    });
+  },
+
+  position() {
+    var contentBox;
+
+    this.regexp.position();
+
+    contentBox = this.contents.getBBox();
+
+    this.start.transform(Snap.matrix()
+      .translate(contentBox.x, contentBox.cy));
+    this.end.transform(Snap.matrix()
+      .translate(contentBox.x2, contentBox.cy));
+  },
+
   flags() {
     var flags;
 
@@ -16,13 +44,5 @@ export default _.extend({}, Base, {
       ignore_case: /i/.test(flags),
       multiline: /m/.test(flags)
     };
-  },
-
-  expression() {
-    if (this.regexp) {
-      return this.regexp;
-    } else {
-      return this;
-    }
   }
 });