[Mapbender-commits] r8881 - in trunk/mapbender: http/plugins lib
svn_mapbender at osgeo.org
svn_mapbender at osgeo.org
Tue May 20 07:12:42 PDT 2014
Author: hwbllmnn
Date: 2014-05-20 07:12:42 -0700 (Tue, 20 May 2014)
New Revision: 8881
Modified:
trunk/mapbender/http/plugins/kmlTree.js
trunk/mapbender/http/plugins/mb_digitize_widget.php
trunk/mapbender/lib/mb.ui.displayKmlFeatures.js
Log:
experimental style dialog with colorpicker, added a couple of IE8 workarounds
Modified: trunk/mapbender/http/plugins/kmlTree.js
===================================================================
--- trunk/mapbender/http/plugins/kmlTree.js 2014-05-16 13:38:37 UTC (rev 8880)
+++ trunk/mapbender/http/plugins/kmlTree.js 2014-05-20 14:12:42 UTC (rev 8881)
@@ -165,7 +165,7 @@
}
});
- $("*:checkbox",$kmlEntry).bind('click', function(){
+ $('input[type="checkbox"]', $kmlEntry).bind('click', function(){
var idx = $(this).parent().attr('idx');
if(idx === undefined) {
@@ -191,10 +191,19 @@
}else{
$(this).parent().removeClass("closed");
$(this).parent().addClass("open");
+ }
- }
+ // IE8 workaround to make style previews visible...
+ $(this).parent().find('ul.ui-sortable li .rvml').removeClass('rvml').addClass('rvml');
});
+ $('#tabs_kmlTree').bind('click', function() {
+ window.setTimeout(function() {
+ // IE8 workaround to make style previews visible...
+ $('#kmlTree').find('ul.ui-sortable li .rvml').removeClass('rvml').addClass('rvml');
+ }, 1000);
+ });
+
});
};
Modified: trunk/mapbender/http/plugins/mb_digitize_widget.php
===================================================================
--- trunk/mapbender/http/plugins/mb_digitize_widget.php 2014-05-16 13:38:37 UTC (rev 8880)
+++ trunk/mapbender/http/plugins/mb_digitize_widget.php 2014-05-20 14:12:42 UTC (rev 8881)
@@ -105,6 +105,19 @@
'<div class="digitize-image digitize-save"></div>' +
'</div>';
+ var editStyleHtml = '<div title="Edit style">' +
+ '<div class="digitize-preview"></div>' +
+ '<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>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>' +
+ '</table><br></br>' +
+ '<div class="digitize-image digitize-save"></div>' +
+ '</div>';
+
var folderMenu = '<ul class="digitize-contextmenu">' +
'<li><div class="digitize-image digitize-pencil"></div>Edit</li>' +
'<li><div class="digitize-image digitize-zoomto"></div>Zoom to</li>' +
@@ -135,6 +148,7 @@
var digitizeDialog,
editDialog,
attributesDialog,
+ editStyleDialog,
button,
that = this,
inProgress = false,
@@ -175,6 +189,14 @@
that.destroy();
});
+ editStyleDialog = $(editStyleHtml);
+ editStyleDialog.dialog({
+ autoOpen: false,
+ position: [o.$target.offset().left, o.$target.offset().top]
+ }).bind('dialogclose', function() {
+ button.stop();
+ $(this).find('input').unbind('change');
+ });
//
// Initialise button
//
@@ -188,8 +210,10 @@
stop: that.deactivate
});
- $('li:has(.digitize-close)').live('click', function() {
- $(this).parent().menu('destroy').remove();
+ $('li').live('click', function() {
+ if($(this).children('.digitize-close').length === 1) {
+ $(this).parent().menu('destroy').remove();
+ }
});
$('#mapframe1').bind('kml:loaded', function(evt, item) {
@@ -204,6 +228,38 @@
});
};
+ var editStyle = function($link, menu) {
+ return function() {
+ editStyleDialog.dialog('open');
+ var idx = $link.attr('idx');
+ var kml = $('#mapframe1').data('kml');
+ var url = $link.parent().parent().attr('title');
+ var feature = kml._kmls[url].data.features[idx];
+ var preview = editStyleDialog.find('.digitize-preview');
+ preview.html('');
+ preview = preview.get(0);
+ kml.renderPreview(feature, preview);
+ $.each(feature.properties, function(k, v) {
+ editStyleDialog.find('input[name="' + k + '"]').val(v);
+ });
+ editStyleDialog.find('input').bind('change', function() {
+ editStyleDialog.find('input').each(function() {
+ feature.properties[$(this).attr('name')] = $(this).val();
+ 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);
+ });
+ editStyleDialog.find('input[name="fill"]').spectrum();
+ editStyleDialog.find('input[name="stroke"]').spectrum();
+ menu.menu('destroy').remove();
+ };
+ };
+
var contextmenuObject = function() {
var $link = $(this);
if($link.attr('idx') === undefined) {
@@ -237,6 +293,7 @@
menu.menu('destroy').remove();
});
+ menu.children('li:has(.digitize-style)').bind('click', editStyle($link, menu));
return false;
};
Modified: trunk/mapbender/lib/mb.ui.displayKmlFeatures.js
===================================================================
--- trunk/mapbender/lib/mb.ui.displayKmlFeatures.js 2014-05-16 13:38:37 UTC (rev 8880)
+++ trunk/mapbender/lib/mb.ui.displayKmlFeatures.js 2014-05-20 14:12:42 UTC (rev 8881)
@@ -96,7 +96,6 @@
});
var kmls = mb_getWmcExtensionData('KMLS');
- // try{
if(kmls) {
kmls = JSON.parse(kmls);
this._kmls = kmls;
@@ -105,19 +104,13 @@
self.element.trigger('kml:loaded',kmls[k]);
}
}
- // kmls = mb_getWmcExtensionData('ORIGINALKMLS');
- // if(kmls) {
- // this.originalKmls = kmls;
- // }
kmls = mb_getWmcExtensionData('KMLORDER');
if(kmls) {
this.kmlOrder = JSON.parse(kmls);
}
this.render();
- // }catch(e){
- // console.log(e)
- // }
},
+
_init: function(){
var self = this, o = this.options;
this._popup = $('<div></div>').dialog({autoOpen : false, height: 500, width: 500});
@@ -149,17 +142,15 @@
var max = Proj4js.transform(this.wgs84, this.targetProj, {x: bbox[2], y: bbox[3]});
map.calculateExtent(new Mapbender.Extent(min.x, min.y, max.x, max.y));
- map.setMapRequest();
+ map.zoom(true, 0.99999999);
},
showFeature: function(url, idx) {
- // this._kmls[url].highlightArray[idx].paint();
this._kmls[url].data.features[idx].display = true;
this.render();
},
hideFeature: function(url, idx) {
- // this._kmls[url].highlightArray[idx].hide();
this._kmls[url].data.features[idx].display = false;
this.render();
},
@@ -220,18 +211,6 @@
//not adding feed twice
return;
}
- // $.ajax({url: '../php/getOriginalKml.php',
- // data: {url: o.url},
- // type: 'POST',
- // dataType: 'text/plain',
- // success: function(data) {
- // if(!self.originalKmls) {
- // self.originalKmls = {};
- // }
- // self.originalKmls[o.url] = data;
- // self.kmlOrder.push(o.url);
- // }
- // });
this.kmlOrder.push(o.url);
@@ -257,39 +236,6 @@
});
},
- // reload: function() {
- // probably nothing needs to be done when transforming on the fly on the client
- // var self = this, o = this.options;
- // var epsg = $(self.element).mapbender().epsg;
- // epsg = epsg.split(":")[1];
-
- // $.each(self.kmlOrder, function(k, url) {
- // var o = self._kmls[url];
- // if(!o) return;
- // // TODO prevent map reload at this point
- // $('li[title="' + url + '"] > button[name="remove"]').click();
- // $.ajax({ url: self._endpointURL + '?targetEPSG= ' + epsg,
- // data: self.originalKmls[url],
- // type: 'POST',
- // dataType: "json",
- // success : function(data,textStatus,xhr){
- // if(!data){
- // self.element.trigger('kml:error',"request returned no data");
- // }
- // else if(data.errorMessage){
- // self.element.trigger('kml:error',data.errorMessage);
- // }else{
- // self._kmls[o.url] = {type:"geojson",data:data,url:o.url,display: o.display, loadedOnStartup: true};
- // self.element.trigger('kml:loaded',{type:"geojson",data:data,url:o.url,display: o.display});
- // }
- // },
- // error: function(XMLHttpRequest, textStatus, errorThrown){
- // self.element.trigger('kml:error',"Problem talking to server: " + errorThrown);
- // }
- // });
- // });
- // },
-
setOrder: function(order) {
this.kmlOrder = order;
this.render();
@@ -324,10 +270,6 @@
},
remove: function(url){
- // nrgh there are still references to the highlightobjects somewhere!
- for(var i in this._kmls[url].highlightArray){
- this._kmls[url].highlightArray[i].clean();
- }
delete(this._kmls[url]);
var $map = $(this.element).mapbender();
var extent = $map.getExtentInfos();
@@ -397,12 +339,23 @@
pt = $('#mapframe1').mapbender().convertRealToPixel(pt);
}
if(isNaN(pt.x) || isNaN(pt.y)) return;
+ // is this the right place and way to fix it?
if(feature.properties['Mapbender:icon']) {
+ feature.properties['marker-symbol'] = feature.properties['Mapbender:icon'];
+ feature.properties['Mapbender:icon'] = null;
+ }
+ if(feature.properties['marker-symbol']) {
var size = 32;
+ if(feature.properties['marker-size'] === 'small') {
+ size = 20;
+ }
+ if(feature.properties['marker-size'] === 'large') {
+ size = 64;
+ }
if(feature.preview) {
size = 20;
}
- var img = canvas.image(feature.properties['Mapbender:icon'], pt.x, pt.y, size, size).node;
+ var img = canvas.image(feature.properties['marker-symbol'], pt.x, pt.y, size, size).node;
if(img.setAttributeNS) {
img.setAttributeNS(null, "preserveAspectRatio" , "xMidYMid meet" );
}
More information about the Mapbender_commits
mailing list