<html>
  <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    <div class="moz-cite-prefix">Hey Rob,<br>
      <br>
        Looking deeper, I may have found part of the issue.  If you put
      a breakpoint in the OpenLayers.Handler.Feature, line 353 :<br>
      <br>
          if(dpx <= this.clickTolerance) {<br>
              this.callback(key, args);<br>
          }<br>
      <br>
        you'll notice that the feature handler stop at this point.  The
      callback method isn't called, thus resulting in our registered
      'click' callback we made not being fired, nor the original one
      from the DragControl.  The dpx is greater than the clickTolerance,
      that's the problem.  The 'up' and 'down' positions seem erroneous,
      and I don't understand what's the cause.<br>
      <br>
        I think we'll need an OpenLayers dev answer, but this may be a
      bug, or a consequence of something we do incorrectly.<br>
      <br>
      Regards,<br>
      <br>
      Alexandre<br>
      <br>
      <br>
      On 13-03-01 09:15 AM, Alexandre Dubé wrote:<br>
    </div>
    <blockquote cite="mid:5130B7E6.3050508@mapgears.com" type="cite">
      <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
      <div class="moz-cite-prefix">Hi Rob,<br>
        <br>
          I look and haven't found what's causing the issue, but here's
        some updates anyway:<br>
        <br>
          You shouldn't set the standalone property after the
        instantiation of the modify control.  If you look at the code,
        that property is used in the initialize function.<br>
        <br>
          I noticed that the DragControl already has a 'click' callback
        method, so the way I suggested currently overrides it
        completely.  Making the following change makes the chain
        continue: <br>
        <br>
            click: function(feature) {<br>
                this.layer.events.triggerEvent(<br>
                    "vertexclicked", {feature: feature}<br>
                )<br>
                // call the dragControl original click callback method<br>
                control.dragControl.clickFeature.apply(<br>
                    control.dragControl, [feature]);<br>
            }<br>
        <br>
          Even with the above fix, I notice that the callback method is
        never triggered. The feature handler is still active though. I
        don't know what's wrong. This may be an issue in OpenLayers.<br>
        <br>
        Regards,<br>
        <br>
        Alexandre<br>
        <br>
        <br>
        On 13-03-01 07:26 AM, Robert Smart wrote:<br>
      </div>
      <blockquote cite="mid:SNT127-DS4C47F15459E2401D21E80AAFF0@phx.gbl"
        type="cite">
        <meta content="text/html; charset=UTF-8"
          http-equiv="Content-Type">
        <div dir="ltr">
          <div style="FONT-FAMILY: 'Calibri'; COLOR: #000000; FONT-SIZE:
            12pt">
            <div>Hi,</div>
            <div> </div>
            <div>I’ve made a start on modifying the code so it does what
              i need. However I need it work in standalone mode, and it
              seems to exhibit some odd behaviour.</div>
            <div> </div>
            <div>If I start editing and selecting points it all works
              fine, but if I click outside of the polygon (it remains
              editable since it is in standalone mode)when I go back to
              the polygon the click event no longer fires, so I can no
              longer select a vertex. </div>
            <div> </div>
            <div>Any ideas what might be causing this?</div>
            <div> </div>
            <div>I’ve pasted the page code below. I have not changed the
              modifyFeatureVertexSelection code at all except putting it
              in a seperate js file.</div>
            <div> </div>
            <div>Thanks,</div>
            <div> </div>
            <div>Rob Smart</div>
            <div> </div>
            <div><div id="map" style="width:500px; height:500px; "
              ></div></div>
            <div>      <input id="Button4" type="button"
              value="Delete Selected Vertex"
              onclick="deleteSelectedVertex()" /></div>
            <div> </div>
            <div>   <script type="text/javascript"></div>
            <div> </div>
            <div>   var map, vectors, modify, feature, selectedVertex;</div>
            <div> </div>
            <div>   $(document).ready(function () {</div>
            <div> </div>
            <div>       map = new OpenLayers.Map('map');</div>
            <div>       var wms = new OpenLayers.Layer.WMS("OpenLayers
              WMS",</div>
            <div>       "<a moz-do-not-send="true"
                href="http://vmap0.tiles.osgeo.org/wms/vmap0?%22">http://vmap0.tiles.osgeo.org/wms/vmap0?"</a>,
              { layers: 'basic' });</div>
            <div>      
              OpenLayers.Feature.Vector.style['default']['strokeWidth']
              = '2';</div>
            <div> </div>
            <div>       // allow testing of specific renderers via
              "?renderer=Canvas", etc</div>
            <div>       var renderer =
              OpenLayers.Util.getParameters(window.location.href).renderer;</div>
            <div>       renderer = (renderer) ? [renderer] :
              OpenLayers.Layer.Vector.prototype.renderers;</div>
            <div> </div>
            <div>       var style = $.extend(true, {},
              OpenLayers.Feature.Vector.style['default']); // get a copy
              of the default style</div>
            <div>       style.fillColor = "Red";</div>
            <div>       style.fillOpacity = 1;</div>
            <div> </div>
            <div>       var myStyleMap = new OpenLayers.StyleMap({</div>
            <div>           "temporary": new OpenLayers.Style(style)</div>
            <div>       });</div>
            <div> </div>
            <div>       vectors = new OpenLayers.Layer.Vector("Vector
              Layer", {</div>
            <div>           renderers: renderer, styleMap: myStyleMap</div>
            <div>       });</div>
            <div> </div>
            <div>       map.addLayers([wms, vectors]);</div>
            <div> </div>
            <div> </div>
            <div>       feature = new OpenLayers.Feature.Vector(</div>
            <div>      
              OpenLayers.Geometry.Polygon.createRegularPolygon(</div>
            <div>           new OpenLayers.Geometry.Point(0, 0),</div>
            <div>           10,</div>
            <div>           5</div>
            <div>       ),</div>
            <div>       {}</div>
            <div>   );</div>
            <div>       vectors.addFeatures([feature]);</div>
            <div> </div>
            <div>       if (console && console.log) {</div>
            <div>           // register a callback function to our new
              "vertexclicked" event</div>
            <div>           vectors.events.on({ "vertexclicked":
              function report(event) {</div>
            <div>               console.log(event.type,
              event.feature.id);</div>
            <div> </div>
            <div>               myVertices =
              feature.geometry.getVertices();</div>
            <div>               realVertex = false;</div>
            <div> </div>
            <div>               //TEST TO SEE IF ITS A REAL VERTEX</div>
            <div>               for (var i = 0; i <
              myVertices.length; i++) {</div>
            <div>                   //console.log(myVertices[i]);</div>
            <div> </div>
            <div>                   if (myVertices[i] ==
              event.feature.geometry) { realVertex = true; }</div>
            <div>                   //Do something</div>
            <div>               }</div>
            <div> </div>
            <div>               if (realVertex == false) {
              console.log("virtualVertex"); return; }</div>
            <div> </div>
            <div>               console.log(event.feature)</div>
            <div> </div>
            <div> </div>
            <div>               if (selectedVertex == null) {</div>
            <div>                   selectedVertex = event.feature;</div>
            <div>                   vectors.drawFeature(event.feature,
              "temporary");</div>
            <div>                   return;</div>
            <div>               }</div>
            <div> </div>
            <div>               if (event.feature == selectedVertex) {</div>
            <div>                   vectors.drawFeature(event.feature,
              "default");</div>
            <div>                   selectedVertex = null;</div>
            <div>                   return;</div>
            <div>               }</div>
            <div> </div>
            <div>               if (event.feature != selectedVertex) {</div>
            <div>                   vectors.drawFeature(selectedVertex,
              "default");</div>
            <div>                   selectedVertex = event.feature;</div>
            <div>                   vectors.drawFeature(event.feature,
              "temporary");</div>
            <div>               }</div>
            <div> </div>
            <div>               // change the color - sure !</div>
            <div> </div>
            <div> </div>
            <div>               //                // do more - popup to
              delete the vertex</div>
            <div>               //                c = [];</div>
            <div>               //                c.push("Selected
              feature id: ");</div>
            <div>               //               
              c.push(vectors.selectedFeatures[0].id);</div>
            <div>               //                c.push("\nSelected
              vertex id: ");</div>
            <div>               //               
              c.push(event.feature.id);</div>
            <div>               //                c.push("\n\nRemove
              this vertex?")</div>
            <div>               //                var removeVertex =
              confirm(c.join(""));</div>
            <div> </div>
            <div>               //                if (removeVertex) {</div>
            <div>               //                    // I noticed that
              the ModifyFeature control doesn't have</div>
            <div>               //                    // a method to
              manage a vertices removal, it's only done inside</div>
            <div>               //                    // the
              'handleKeypress' callback method... but it doesn't</div>
            <div>               //                    // prevent us from
              using it :) so we'll emulate a 'delete' key</div>
            <div>               //                    // pressed</div>
            <div>               //                   
              modify.dragControl.feature = event.feature;</div>
            <div>               //                   
              modify.handleKeypress({ keyCode: 46 });</div>
            <div>               //                } else {</div>
            <div>               //                    // simply redraw
              the vertex back to its default style</div>
            <div>               //                   
              vectors.drawFeature(event.feature, "default");</div>
            <div>               //                }</div>
            <div>           }</div>
            <div>           });</div>
            <div>       }</div>
            <div> </div>
            <div>       modify = new
              OpenLayers.Control.ModifyFeatureVertexClick(vectors);</div>
            <div>       modify.standalone = true;</div>
            <div>       map.addControls([modify]);</div>
            <div>       modify.activate();</div>
            <div> </div>
            <div>       map.setCenter(new OpenLayers.LonLat(0, 0), 3);</div>
            <div> </div>
            <div>       // select with a delay to let the map render and
              apply the default style</div>
            <div>       // to the feature, which emulates a selection
              that would be made using a</div>
            <div>       // click on the feature</div>
            <div>       setTimeout(function () {</div>
            <div>           modify.selectControl.select(feature);</div>
            <div>       });</div>
            <div> </div>
            <div>   });</div>
            <div> </div>
            <div>   function deleteSelectedVertex() {</div>
            <div> </div>
            <div>       if (selectedVertex != null) { </div>
            <div>       modify.dragControl.feature = selectedVertex;</div>
            <div>       modify.handleKeypress({ keyCode: 46 });</div>
            <div>       //This works for some of the issues but not all
              of the them</div>
            <div>       //vectors.destroyFeatures([selectedVertex])</div>
            <div>       modify.dragControl.feature = null;</div>
            <div>       selectedVertex = null;</div>
            <div>       modify.selectControl.select(feature);</div>
            <div> </div>
            <div>   }</div>
            <div> </div>
            <div>   }</div>
            <div>   </div>
            <div>   </script></div>
            <div style="FONT-STYLE: normal; DISPLAY: inline;
              FONT-FAMILY: 'Calibri'; COLOR: #000000; FONT-SIZE: small;
              FONT-WEIGHT: normal; TEXT-DECORATION: none">
              <div style="FONT: 10pt tahoma">
                <div> </div>
                <div style="BACKGROUND: #f5f5f5">
                  <div style="font-color: black"><b>From:</b> <a
                      moz-do-not-send="true" title="adube@mapgears.com"
                      href="mailto:adube@mapgears.com">Alexandre Dubé</a>
                  </div>
                  <div><b>Sent:</b> Thursday, February 28, 2013 7:05 PM</div>
                  <div><b>To:</b> <a moz-do-not-send="true"
                      title="r_n_smart@hotmail.com"
                      href="mailto:r_n_smart@hotmail.com">Robert Smart</a>
                  </div>
                  <div><b>Cc:</b> <a moz-do-not-send="true"
                      title="openlayers-users@lists.osgeo.org"
                      href="mailto:openlayers-users@lists.osgeo.org">openlayers-users@lists.osgeo.org</a>
                  </div>
                  <div><b>Subject:</b> Re: [OpenLayers-Users]
                    ModifyControl Select/Delete Vertex?</div>
                </div>
              </div>
              <div> </div>
            </div>
            <div style="FONT-STYLE: normal; DISPLAY: inline;
              FONT-FAMILY: 'Calibri'; COLOR: #000000; FONT-SIZE: small;
              FONT-WEIGHT: normal; TEXT-DECORATION: none">
              <div class="moz-cite-prefix">Hi Robert,<br>
                <br>
                  Yep, all the things you ask are quite possible but not
                without getting your hand a bit dirty :)  You can do all
                that by programming.  Extend the ModifyControl more to
                make it do what you want.  Don't be afraid to look at
                the source code to see what the components do.  You'll
                get more knowledge that way.<br>
                <br>
                  I'd be happy to see the end result.  Best of luck to
                you.<br>
                <br>
                Kind regards,<br>
                <br>
                Alexandre<br>
                <br>
                  <br>
                <br>
                On 13-02-28 12:36 PM, Robert Smart wrote:<br>
              </div>
              <br>
              <blockquote
                cite="mid:SNT127-DS14390D2D2EFF542465EF14AAFE0@phx.gbl"
                type="cite">
                <div dir="ltr">
                  <div style="FONT-FAMILY: 'Calibri'; COLOR: #000000;
                    FONT-SIZE: 12pt">
                    <div>This there a way to define a style for the
                      selected vertex? </div>
                  </div>
                </div>
              </blockquote>
              <br>
              Sure.  Look at the OpenLayers.Layer.Feature drawFeature
              method, second argument.<br>
              <br>
              <br>
              <blockquote
                cite="mid:SNT127-DS14390D2D2EFF542465EF14AAFE0@phx.gbl"
                type="cite">
                <div dir="ltr">
                  <div style="FONT-FAMILY: 'Calibri'; COLOR: #000000;
                    FONT-SIZE: 12pt">
                    <div> </div>
                    <div>Is there a way to store a reference to the
                      selected vertex in the modify feature control? So
                      that I could allow a user to select a vertex and
                      then if they choose to delete it, I can just pull
                      out a reference to it in the code from the modify
                      feature. I suppose this could also just be a
                      deleteSeletectedVertex function on the
                      modifyFeature control too.</div>
                  </div>
                </div>
              </blockquote>
              <br>
              Yep, but you'll need to program that.<br>
              <br>
              <br>
              <blockquote
                cite="mid:SNT127-DS14390D2D2EFF542465EF14AAFE0@phx.gbl"
                type="cite">
                <div dir="ltr">
                  <div style="FONT-FAMILY: 'Calibri'; COLOR: #000000;
                    FONT-SIZE: 12pt">
                    <div> </div>
                    <div>Is there a way to deselect the the vertex too?
                      So if I click on it and it changes its style to
                      the ‘selected’ style, I can then click on it again
                      to deselect it?</div>
                  </div>
                </div>
              </blockquote>
              <br>
              If you keep track of the current one selected, yeah you
              could.  This is also done programmatically.<br>
              <br>
              <br>
              <br>
              <pre class="moz-signature" cols="72">-- 
Alexandre Dubé
Mapgears
<a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="http://www.mapgears.com">www.mapgears.com</a>
</pre>
            </div>
          </div>
        </div>
      </blockquote>
      <br>
      <br>
      <pre class="moz-signature" cols="72">-- 
Alexandre Dubé
Mapgears
<a moz-do-not-send="true" class="moz-txt-link-abbreviated" href="http://www.mapgears.com">www.mapgears.com</a>
</pre>
      <br>
      <fieldset class="mimeAttachmentHeader"></fieldset>
      <br>
      <pre wrap="">_______________________________________________
Users mailing list
<a class="moz-txt-link-abbreviated" href="mailto:Users@lists.osgeo.org">Users@lists.osgeo.org</a>
<a class="moz-txt-link-freetext" href="http://lists.osgeo.org/mailman/listinfo/openlayers-users">http://lists.osgeo.org/mailman/listinfo/openlayers-users</a>
</pre>
    </blockquote>
    <br>
    <br>
    <pre class="moz-signature" cols="72">-- 
Alexandre Dubé
Mapgears
<a class="moz-txt-link-abbreviated" href="http://www.mapgears.com">www.mapgears.com</a>
</pre>
  </body>
</html>