[OpenLayers-Commits] r10850 - in sandbox/sonxurxo/wfs-t: examples lib

commits-20090109 at openlayers.org commits-20090109 at openlayers.org
Wed Oct 20 06:51:51 EDT 2010


Author: sonxurxo
Date: 2010-10-20 03:51:51 -0700 (Wed, 20 Oct 2010)
New Revision: 10850

Modified:
   sandbox/sonxurxo/wfs-t/examples/wfs-transaction-optimized.html
   sandbox/sonxurxo/wfs-t/lib/OpenLayers.js
Log:
Improved, loading panel

Modified: sandbox/sonxurxo/wfs-t/examples/wfs-transaction-optimized.html
===================================================================
--- sandbox/sonxurxo/wfs-t/examples/wfs-transaction-optimized.html	2010-10-19 09:52:55 UTC (rev 10849)
+++ sandbox/sonxurxo/wfs-t/examples/wfs-transaction-optimized.html	2010-10-20 10:51:51 UTC (rev 10850)
@@ -37,9 +37,6 @@
                 float: left;
                 margin-top: 20px;
             }
-            #note {
-                font-style: italic;
-            }
             .olControlNavToolbar div {
                 display:block;
                 width:  28px;
@@ -47,7 +44,7 @@
                 top: 300px;
                 left: 6px;
                 position: relative;
-            }
+            }            
             .olControlEditingToolbar .olControlModifyItemActive {
                 background-image: url("../theme/default/img/draw_polygon_on.png");
                 background-repeat: no-repeat;
@@ -60,10 +57,22 @@
                 background-image: url("../theme/default/img/move_feature_on.png");
                 background-repeat: no-repeat;
             }
+            .olControlLoadingPanel {
+                background-image:url(../theme/default/img/loading.gif);
+                margin-left: 30%;
+                margin-top: 50%;
+                position: relative;
+                width: 195px;
+                height: 11px;
+                background-position:center;
+                background-repeat:no-repeat;
+                display: none;
+            }
 	</style>
         <script type="text/javascript" src="../lib/OpenLayers.js"></script>
         <script>
             var map;
+            
             //OpenLayers.ProxyHost= "/cgi-bin/proxy.cgi?url=";
             OpenLayers.ProxyHost = "proxy.cgi?url=";
 
@@ -74,12 +83,13 @@
                          -73.907820, 40.882078
                     )
                 });
-                /*
-                 * The WMS layer (which has a WFS equivalent) is the layer we are going
-                 * to display
-                 */
+                
+                var reloadingWMS = false;
+                
+                var saveStrategy = new OpenLayers.Strategy.Save();
+                
                 var wms = new OpenLayers.Layer.WMS(
-                    "WMS", 
+                    "WMS",
                     "http://sigma.openplans.org/geoserver/wms",
                     {
                         layers: 'topp:poly_landmarks',
@@ -90,9 +100,7 @@
                         buffer: 0
                     }
                 );
-                
-                var saveStrategy = new OpenLayers.Strategy.Save();
-                
+
                 /*
                  * Layer that point to the WFS-T service. It will not load any features from the
                  * remote WFS server by itself, the GetFeature control will do that and place features
@@ -111,7 +119,7 @@
                             url: "http://sigma.openplans.org/geoserver/wms",
                             featureType: "poly_landmarks",
                             featurePrefix: "topp",
-                            featureNS: "http://www.openplans.org/topp"
+                            featureNS: "http://www.openplans.org/topp",
                         }),
                         /*
                          * Not base layer, visible (to show the features when added), and not 
@@ -122,57 +130,38 @@
                         displayInLayerSwitcher: false
                     }
                 );
-                
+                    
                 map.addLayers([wms, wfs]);
-
-                /*
-                 * Controls
-                 */
-                var panel = new OpenLayers.Control.Panel({
-                    displayClass: 'olControlEditingToolbar'
-                });;
-                
-                /*
-                 * Gets a feature through WFS at the same URL where the WMS layer
-                 * passed as argument is
-                 */
+                    
                 var getFeatureControlToModify = new OpenLayers.Control.GetFeature({
                     protocol: OpenLayers.Protocol.WFS.fromWMSLayer(wms),
                     displayClass: 'olControlModify',
                     title: 'Select a feature to modify'
                 });
-
-                /*
-                 * When catching a feature through WFS, it will be added to the 'wfs'
-                 * layer. Deactivating this control avoids sendings additional getFeature
-                 * requests when clicking outside the feature while modifying. We also add
-                 * to the panel a save control.
-                 */
                 getFeatureControlToModify.events.register("featureselected", this, function(e) {
                     wfs.addFeatures([e.feature]);
                     modifyFeatureControl.selectFeature(e.feature);
+                    modifyFeatureControl.selectControl.select(e.feature);
+                    modifyFeatureControl.activate();
                     getFeatureControlToModify.deactivate();
                     setInitPanel();
-                    setTemporaryMessage('Feature selected. Now you can modify it.', 2000);
+                    setTemporaryMessage('Feature selected. Now you can modify it.<br/>To remove a vertix press ESCAPE key when over it', 5000);
                 });
-                
-                /*
-                 * The same logic applied to 'getFeatureControlToModify' applies here, but for
-                 * deleting
-                 */
                 var getFeatureControlToDelete = new OpenLayers.Control.GetFeature({
                     protocol: OpenLayers.Protocol.WFS.fromWMSLayer(wms),
                     displayClass: 'olControlCancel',
                     title: 'Select a feature to delete (sorry for the icon ;) )'
                 });
-                
+                    
                 /*
                  * The modify control works on the 'wfs' layer
                  */
                 var modifyFeatureControl = new OpenLayers.Control.ModifyFeature(wfs, {
-                    standalone: true
+                    clickout: false,
+                    toggle: false,
+                    deleteCodes: [46, 68, 27]
                 });
-
+    
                 /*
                  * When selecting a feature through the GetFeature control, we first add it to the 
                  * 'wfs' layer. Then we show a confirmation dialog: if you cancel the operation, 
@@ -187,7 +176,6 @@
                         e.feature.state = OpenLayers.State.DELETE;
                         saveStrategy.save();
                         getFeatureControlToDelete.deactivate();
-                        setTemporaryMessage('The feature has been deleted. Please reload the page or make OpenLayers reload the images by zooming or panning the map', 5000);
                     } else {
                         wfs.removeFeatures([e.feature]);
                     }
@@ -207,31 +195,54 @@
                 });
                 /*
                  * When the user clicks on the Save Button, we execute the SaveStrategy.save()
-                 * method. After saving, we reset the 'wfs' layer and remove the Save and Cancel
-                 * button from the panel.
+                 * method.
                  */
                 var saveControl = new OpenLayers.Control.Button({
                     title: "Save Changes",
                     trigger: function() {
                         saveStrategy.save();
-                        wfs.removeAllFeatures();
-                        setModifyingPanel();
-                        setTemporaryMessage('The feature has been saved. Please reload the page or make OpenLayers reload the images by zooming or panning the map', 5000);
                     },
-                    displayClass: "olControlSaveFeatures",
-                    title: 'Save unsing WFS-T'
+                    displayClass: "olControlSaveFeatures"
                 });
+                    
+                /*
+                 * When reloaded, empty the message
+                 */
+                wms.events.register("loadend", this, function() {
+                    if (reloadingWMS) {
+                        wfs.removeAllFeatures();
+                        reloadingWMS = false;
+                    }
+                });
+                /*
+                 * When finish saving, reload WMS layer, reset the 'wfs' layer and 
+                 * remove the Save and Cancel button from the panel.
+                 */
+                saveStrategy.events.register("success", this, function() {
+                    reloadingWMS = true;
+                    wms.redraw(true);
+                    setModifyingPanel();
+                });
                 
                 /*
+                 * Controls
+                 */
+                var panel = new OpenLayers.Control.Panel({
+                    displayClass: 'olControlEditingToolbar'
+                });
+                
+                /*
                  * Only the getFeature control is visible at first.
                  */
                 panel.addControls([getFeatureControlToModify, getFeatureControlToDelete]);
+                
                 map.addControls([
                     panel, 
-                    modifyFeatureControl
+                    modifyFeatureControl,
+                    new OpenLayers.Control.LoadingPanel()
                 ]);
                 
-                map.zoomToMaxExtent();
+                if (!map.getCenter()) map.zoomToMaxExtent();
                 
                 /*****************************
                  * Helper functions
@@ -313,11 +324,6 @@
                 </ul>
             </li>
         </ul>
-        <p id="note">
-            NOTE: as the changes are made through WFS-T and the layer you are viewing is WMS,
-            the browser will cache the images so you need to reload the image or make OpenLayers
-            reload the WMS images (changing zoom level, pan, etc.)
-        </p>
     </div>
 </body>
 

Modified: sandbox/sonxurxo/wfs-t/lib/OpenLayers.js
===================================================================
--- sandbox/sonxurxo/wfs-t/lib/OpenLayers.js	2010-10-19 09:52:55 UTC (rev 10849)
+++ sandbox/sonxurxo/wfs-t/lib/OpenLayers.js	2010-10-20 10:51:51 UTC (rev 10850)
@@ -154,6 +154,7 @@
             "OpenLayers/Handler/MouseWheel.js",
             "OpenLayers/Handler/Keyboard.js",
             "OpenLayers/Control.js",
+            "OpenLayers/Control/LoadingPanel.js",
             "OpenLayers/Control/Attribution.js",
             "OpenLayers/Control/Button.js",
             "OpenLayers/Control/ZoomBox.js",



More information about the Commits mailing list