Start work on turn restriction editing field

css/app.css

@@ -1534,6 +1534,13 @@ input[type=number] {
     border-bottom: 0;
     border-radius: 0 0 4px 0;
 }
+
+/* Restrictions editor */
+
+.form-field-restrictions .preset-input-wrap {
+    height: 300px;
+}
+
 /* combobox dropdown */
 
 div.combobox {

data/presets.yaml

@@ -296,6 +296,8 @@ en:
           taoist: Taoist
       restriction: 
         label: Type
+      restrictions: 
+        label: Turn Restrictions
       route: 
         label: Type
       route_master: 

data/presets/fields.json

@@ -721,6 +721,15 @@
         "type": "combo",
         "label": "Type"
     },
+    "restrictions": {
+        "type": "restrictions",
+        "geometry": "vertex",
+        "icon": "restrictions",
+        "reference": {
+            "rtype": "restriction"
+        },
+        "label": "Turn Restrictions"
+    },
     "route": {
         "key": "route",
         "type": "combo",

data/presets/fields/restrictions.json

@@ -0,0 +1,9 @@
+{
+    "type": "restrictions",
+    "geometry": "vertex",
+    "icon": "restrictions",
+    "reference": {
+        "rtype": "restriction"
+    },
+    "label": "Turn Restrictions"
+}

data/presets/presets.json

@@ -4245,6 +4245,9 @@
         "tags": {
             "highway": "traffic_signals"
         },
+        "fields": [
+            "restrictions"
+        ],
         "terms": [
             "light",
             "stoplight",

data/presets/presets/highway/traffic_signals.json

@@ -5,6 +5,9 @@
     "tags": {
         "highway": "traffic_signals"
     },
+    "fields": [
+        "restrictions"
+    ],
     "terms": [
         "light",
         "stoplight",

data/presets/schema/field.json

@@ -63,7 +63,8 @@
                 "textarea",
                 "localized",
                 "wikipedia",
-                "typeCombo"
+                "typeCombo",
+                "restrictions"
             ],
             "required": true
         },

dist/locales/en.json

@@ -825,6 +825,9 @@
             "restriction": {
                 "label": "Type"
             },
+            "restrictions": {
+                "label": "Turn Restrictions"
+            },
             "route": {
                 "label": "Type"
             },

index.html

@@ -120,6 +120,7 @@
         <script src='js/id/ui/preset/localized.js'></script>
         <script src='js/id/ui/preset/maxspeed.js'></script>
         <script src='js/id/ui/preset/radio.js'></script>
+        <script src='js/id/ui/preset/restrictions.js'></script>
         <script src='js/id/ui/preset/textarea.js'></script>
         <script src='js/id/ui/preset/wikipedia.js'></script>
 

js/id/ui/preset/restrictions.js

@@ -0,0 +1,71 @@
+iD.ui.preset.restrictions = function(field, context) {
+    var event = d3.dispatch('change'),
+        entity;
+
+    function restrictions(selection) {
+        var wrap = selection.selectAll('.preset-input-wrap')
+            .data([0]);
+
+        // Enter
+
+        var enter = wrap.enter().append('div')
+            .attr('class', 'preset-input-wrap');
+
+        enter.append('svg')
+            .call(iD.svg.Surface(context))
+            .call(iD.behavior.Hover(context));
+
+        var d = wrap.dimensions(),
+            c = [d[0] / 2, d[1] / 2],
+            z = 21;
+
+        var projection = iD.geo.RawMercator()
+            .scale(256 * Math.pow(2, z) / (2 * Math.PI));
+
+        var s = projection(entity ? entity.loc : [0, 0]);
+
+        projection
+            .translate([c[0] - s[0], c[1] - s[1]])
+            .clipExtent([[0, 0], d]);
+
+        var surface = wrap.selectAll('svg'),
+            filter = function () { return true; },
+            extent = iD.geo.Extent(),
+            entities = [],
+            graph = context.graph(),
+            lines = iD.svg.Lines(projection, context),
+            vertices = iD.svg.Vertices(projection, context);
+
+        if (entity) {
+            entities = graph.parentWays(entity).filter(function (parent) {
+                return parent.type === 'way' && parent.tags.highway && !parent.isArea();
+            });
+
+            entities.push(entity);
+        }
+
+        surface
+            .call(vertices, graph, entities, filter, extent, z)
+            .call(lines, graph, entities, filter);
+
+        context.history()
+            .on('change.restrictions', render);
+
+        d3.select(window)
+            .on('resize.restrictions', render);
+
+        function render() {
+            restrictions(selection);
+        }
+    }
+
+    restrictions.tags = function() {};
+
+    restrictions.entity = function(_) {
+        entity = _;
+    };
+
+    restrictions.focus = function() {};
+
+    return d3.rebind(restrictions, event, 'on');
+};