title: Find out if a bounding box is within a vector layer in openlayers 3
body: <p>I have a vector layer that contains many polygons to outline areas of interest on an OSM map.  The user can draw a bounding box on the map to get more information about a certain area of interest.  What I need to check for is if the bounding box that the user draws is within one of the many polygons in my vector layer.
  Is this possible in openlayers 3?  I am finding that I can compare extents, but the extent of my vector layer is the whole map.  I need to find out if the box resides within a smaller area.</p>
  
  <p>Setting up map and vector layer containing geojson:</p>
  
  <pre><code>map = new ol.Map({
          interactions: ol.interaction.defaults({
              keyboard: false,
              altShiftDragRotate: false
          }),
          target: 'create-export-map',
          view: new ol.View({
              projection: "EPSG:4326",
              //extent: [-180,-90,180,90],
              center: [44.4333, 33.3333],
              zoom: 4,
              maxZoom: 18,
          })
      })
  
  
      //add base layers
      var osm = new ol.layer.Tile({
          title: "OpenStreetMap",
          source: new ol.source.OSM({
              wrapX: false,
              noWrap: true,
              attributions: [
                  new ol.Attribution({
                      html: '&amp;copy ' +
                      '&lt;a href="//www.openstreetmap.org/copyright"&gt;OpenStreetMap&lt;/a&gt; contributors.'
                  }),
  
                  ol.source.OSM.ATTRIBUTION
              ]
  
          })
      })
  
      map.addLayer(osm);
  
  regionsSource = new ol.source.Vector({
          wrapX: false,
          noWrap: true,
      });
  
  
      regions = new ol.layer.Vector({
              name: 'regions',
              source: regionsSource,
              style: new ol.style.Style({
                  fill: new ol.style.Fill({
                      color: 'rgba(0,0,0,0)',
                      //opacity: 0.8,
                  }),
                  stroke: new ol.style.Stroke({
                      color: 'rgba(215, 63, 63, 0.8)',
                      width: 3.5,
                  })
              }),
  
          })
      map.addLayer(regions);
  
  $.getJSON(jsonfileURL, function(data){
          var geojson = new ol.format.GeoJSON();
          var features = geojson.readFeatures(data);
          regionsSource.addFeatures(features);
          var extent = regionsSource.getExtent();
  
          map.getView().fit(extent, map.getSize());            
      });
  
  //OL3 add bounding box selection layer
      bboxSource = new ol.source.Vector()
      bbox = new ol.layer.Vector({
          name: 'Select',
          source: bboxSource,
          style: new ol.style.Style({
              stroke: new ol.style.Stroke({
                  color: 'blue'
              }),
              fill: new ol.style.Fill({
                  color: [0, 0, 255, 0.05]
              })
          })
      });
      map.addLayer(bbox);
  
  //Map control for dragbox - bounding box
  var dragBox = new ol.interaction.DragBox({
          condition: ol.events.condition.primaryAction,
      });
  
      var translate;
  
      dragBox.on('boxend', function(e){
          var dragFeature = new ol.Feature({
              geometry: dragBox.getGeometry()
          });
          bboxSource.addFeature(dragFeature);
          map.removeInteraction(dragBox);
          translate = new ol.interaction.Translate({
              features: new ol.Collection([dragFeature])
          });
  
          var bounds = dragFeature.getGeometry().getExtent();
          filtering = true;
  
          // validate the selected extents
          if (validateBounds(bounds)) {
              setBounds(bounds);
          }
          else {
              unsetBounds();
          }
  
  function validateBounds(bounds) {
      var regions, region;
      map.getLayers().forEach(function (l) {
          if (l.get('name') == 'regions')
              regions = l;
      })
  
      var valid_region = false;
  
      // check that we're within a polygon region.
      //This is where I'm stuck...
  }
  </code></pre>
  
  <p>I've tried comparing extents, digging into the region's coordinates, but it's an array, of arrays, of arrays....  Does anyone know a good way to check if the bbox would be within one of the polygons in the Regions layer?  I'm using OpenLayers 3.17.1</p>
  
  <p>In openlayers-2 it was done like this:</p>
  
  <pre><code>for (i = 0; i &lt; regions.length; i++){
          region = regions[i].geometry;
          if (extent.intersects(region)){
              valid_region = true;
          }
  </code></pre>
  
  <p>}</p>
  
  <p>Thanks in advance!</p>