[Mapbender-commits] r8903 - trunk/mapbender/http/plugins

[svn_mapbender at osgeo.org]

Author: hwbllmnn
Date: 2014-05-22 06:21:00 -0700 (Thu, 22 May 2014)
New Revision: 8903

Modified:
   trunk/mapbender/http/plugins/mb_digitize_widget.php
Log:
added opacity sliders


Modified: trunk/mapbender/http/plugins/mb_digitize_widget.php
===================================================================
--- trunk/mapbender/http/plugins/mb_digitize_widget.php	2014-05-22 12:44:07 UTC (rev 8902)
+++ trunk/mapbender/http/plugins/mb_digitize_widget.php	2014-05-22 13:21:00 UTC (rev 8903)
@@ -110,10 +110,10 @@
         '<table><tr><td>Symbol:</td><td><input type="text" name="marker-symbol" value=""></input></td></tr>' +
         '<tr><td>Symbolgröße:</td><td><input type="text" name="marker-size" value=""></input></td></tr>' +
         '<tr><td>Linienfarbe</td><td><input type="color" name="stroke" value="#000000"></input></td></tr>' +
-        '<tr><td>Liniendeckkraft:</td><td><input type="text" name="stroke-opacity" value="1"></input></td></tr>' +
+        '<tr><td>Liniendeckkraft:</td><td><div class="opacity-slider" data-name="stroke-opacity"></div></td></tr>' +
         '<tr><td>Liniendicke:</td><td><input type="text" name="stroke-width" value="1"></input></td></tr>' +
         '<tr><td>Flächenfarbe:</td><td><input type="color" name="fill" value="#ff0000"></input></td></tr>' +
-        '<tr><td>Flächendeckkraft:</td><td><input type="text" name="fill-opacity" value="1"></input></td></tr>' +
+        '<tr><td>Flächendeckkraft:</td><td><div class="opacity-slider" data-name="fill-opacity"></div></td></tr>' +
         '</table><br></br>' +
         '<div class="digitize-image digitize-save"></div>' +
         '</div>';
@@ -198,6 +198,14 @@
             button.stop();
             $(this).find('input').unbind('change');
         });
+
+        editStyleDialog.find('div.opacity-slider').slider({
+            min: 0,
+            max: 100,
+            step: 1,
+            value: 100
+        });
+
         //
         // Initialise button
         //
@@ -239,15 +247,15 @@
             var isline = false;
 
             if(feature.geometry.type.match(/point/i)) {
-                editStyleDialog.find('input[name*="fill"],input[name*="stroke"]').parent().parent().css('display', 'none');
+                editStyleDialog.find('input[name*="fill"],input[name*="stroke"],.opacity-slider').parent().parent().css('display', 'none');
                 editStyleDialog.find('input[name*="marker"]').parent().parent().css('display', 'table-row');
             }
             if(feature.geometry.type.match(/line/i)) {
-                editStyleDialog.find('input[name*="fill"],input[name*="marker"]').parent().parent().css('display', 'none');
-                editStyleDialog.find('input[name*="stroke"]').parent().parent().css('display', 'table-row');
+                editStyleDialog.find('input[name*="fill"],input[name*="marker"],.opacity-slider[data-name="fill-opacity"]').parent().parent().css('display', 'none');
+                editStyleDialog.find('input[name*="stroke"],.opacity-slider[data-name="stroke-opacity"]').parent().parent().css('display', 'table-row');
             }
             if(feature.geometry.type.match(/polygon/i)) {
-                editStyleDialog.find('input[name*="fill"],input[name*="stroke"]').parent().parent().css('display', 'table-row');
+                editStyleDialog.find('input[name*="fill"],input[name*="stroke"],.opacity-slider').parent().parent().css('display', 'table-row');
                 editStyleDialog.find('input[name*="marker"]').parent().parent().css('display', 'none');
             }
 
@@ -257,6 +265,12 @@
             kml.renderPreview(feature, preview);
             $.each(feature.properties, function(k, v) {
                 editStyleDialog.find('input[name="' + k + '"]').val(v);
+                if(k === 'stroke-opacity') {
+                    editStyleDialog.find('.opacity-slider[data-name="stroke-opacity"]').slider('value', v * 100);
+                }
+                if(k === 'fill-opacity') {
+                    editStyleDialog.find('.opacity-slider[data-name="fill-opacity"]').slider('value', v * 100);
+                }
             });
             editStyleDialog.find('input').bind('change', function() {
                 editStyleDialog.find('input').each(function() {
@@ -269,6 +283,15 @@
                     kml.renderPreview(feature, preview);
                 });
             });
+            $('.opacity-slider').slider('option', 'change', function() {
+                if(isline && $(this).attr('data-name') === 'fill-opacity') {
+                    return;
+                }
+                feature.properties[$(this).attr('data-name')] = $(this).slider('value') / 100;
+                kml.render();
+                var preview = editStyleDialog.find('.digitize-preview').html('').get(0);
+                kml.renderPreview(feature, preview);
+            });
             editStyleDialog.find('.digitize-save').bind('click', function() {
                 editStyleDialog.dialog('close');
                 kml.refresh(url);