Divide the draw features example into two examples

examples/draw-features.js

@@ -5,10 +5,6 @@ goog.require('ol.layer.Tile');
 goog.require('ol.layer.Vector');
 goog.require('ol.source.OSM');
 goog.require('ol.source.Vector');
-goog.require('ol.style.Circle');
-goog.require('ol.style.Fill');
-goog.require('ol.style.Stroke');
-goog.require('ol.style.Style');
 
 var raster = new ol.layer.Tile({
   source: new ol.source.OSM()
@@ -17,22 +13,7 @@ var raster = new ol.layer.Tile({
 var source = new ol.source.Vector({wrapX: false});
 
 var vector = new ol.layer.Vector({
-  source: source,
-  style: new ol.style.Style({
-    fill: new ol.style.Fill({
-      color: 'rgba(255, 255, 255, 0.2)'
-    }),
-    stroke: new ol.style.Stroke({
-      color: '#ffcc33',
-      width: 2
-    }),
-    image: new ol.style.Circle({
-      radius: 7,
-      fill: new ol.style.Fill({
-        color: '#ffcc33'
-      })
-    })
-  })
+  source: source
 });
 
 var map = new ol.Map({
@@ -50,18 +31,9 @@ var draw; // global so we can remove it later
 function addInteraction() {
   var value = typeSelect.value;
   if (value !== 'None') {
-    var geometryFunction;
-    if (value === 'Square') {
-      value = 'Circle';
-      geometryFunction = ol.interaction.Draw.createRegularPolygon(4);
-    } else if (value === 'Box') {
-      value = 'Circle';
-      geometryFunction = ol.interaction.Draw.createBox();
-    }
     draw = new ol.interaction.Draw({
       source: source,
-      type: /** @type {ol.geom.GeometryType} */ (value),
-      geometryFunction: geometryFunction
+      type: /** @type {ol.geom.GeometryType} */ (typeSelect.value)
     });
     map.addInteraction(draw);
   }