0001-maps-add-possibility-to-set-marker-colour-from-a-geo.patch
| combo/apps/maps/forms.py | ||
|---|---|---|
| 28 | 28 |
option_template_name = 'maps/icon_radio_option.html' |
| 29 | 29 | |
| 30 | 30 | |
| 31 |
class ColourOrTextInput(forms.TextInput): |
|
| 32 |
template_name = 'maps/colour_or_text_input.html' |
|
| 33 | ||
| 34 | ||
| 31 | 35 |
class MapLayerForm(forms.ModelForm): |
| 32 | 36 |
geojson_url = TemplatableURLField(label=_('Geojson URL'))
|
| 33 | 37 | |
| ... | ... | |
| 35 | 39 |
model = MapLayer |
| 36 | 40 |
exclude = ('kind',)
|
| 37 | 41 |
widgets = {
|
| 38 |
'marker_colour': forms.TextInput(attrs={'type': 'color'}),
|
|
| 42 |
'marker_colour': ColourOrTextInput,
|
|
| 39 | 43 |
'icon_colour': forms.TextInput(attrs={'type': 'color'}),
|
| 40 | 44 |
} |
| 41 | 45 | |
| combo/apps/maps/migrations/0016_auto_20210927_1945.py | ||
|---|---|---|
| 1 |
# Generated by Django 2.2.21 on 2021-09-27 17:45 |
|
| 2 | ||
| 3 |
from django.db import migrations, models |
|
| 4 | ||
| 5 | ||
| 6 |
class Migration(migrations.Migration): |
|
| 7 | ||
| 8 |
dependencies = [ |
|
| 9 |
('maps', '0015_auto_20210723_1324'),
|
|
| 10 |
] |
|
| 11 | ||
| 12 |
operations = [ |
|
| 13 |
migrations.AlterField( |
|
| 14 |
model_name='maplayer', |
|
| 15 |
name='marker_colour', |
|
| 16 |
field=models.CharField( |
|
| 17 |
default='#0000FF', max_length=100, verbose_name='Marker or surface colour' |
|
| 18 |
), |
|
| 19 |
), |
|
| 20 |
] |
|
| combo/apps/maps/models.py | ||
|---|---|---|
| 124 | 124 |
tiles_default = models.BooleanField(_('Default tiles layer'), default=False)
|
| 125 | 125 | |
| 126 | 126 |
geojson_url = models.CharField(_('Geojson URL'), max_length=1024)
|
| 127 |
marker_colour = models.CharField(_('Marker or surface colour'), max_length=7, default='#0000FF')
|
|
| 127 |
marker_colour = models.CharField(_('Marker or surface colour'), max_length=100, default='#0000FF')
|
|
| 128 | 128 |
icon = models.CharField(_('Marker icon'), max_length=32, blank=True, null=True, choices=ICONS)
|
| 129 | 129 |
icon_colour = models.CharField(_('Icon colour'), max_length=7, default='#000000')
|
| 130 | 130 |
cache_duration = models.PositiveIntegerField(_('Cache duration'), default=60, help_text=_('In seconds.'))
|
| combo/apps/maps/static/js/combo.map.js | ||
|---|---|---|
| 1 | 1 |
$(function() {
|
| 2 |
function getPropertiesListValue(obj, properties_list) {
|
|
| 3 |
if (properties_list.length == 0) return obj; |
|
| 4 |
return getPropertiesListValue(obj[properties_list[0]], properties_list.slice(1)); |
|
| 5 |
} |
|
| 6 |
function getDottedPropertyValue(obj, dotted_property) {
|
|
| 7 |
return getPropertiesListValue(obj, dotted_property.split('.'))
|
|
| 8 |
} |
|
| 9 | ||
| 2 | 10 |
L.Map.include( |
| 3 | 11 |
{
|
| 4 | 12 |
init_geojson_layers: function(layers) {
|
| ... | ... | |
| 76 | 84 |
} |
| 77 | 85 |
}, |
| 78 | 86 |
pointToLayer: function (feature, latlng) {
|
| 79 |
var markerStyles = "background-color: " + geojson_layer.marker_colour + ";"; |
|
| 87 |
if (geojson_layer.marker_colour[0] == '#') {
|
|
| 88 |
var colour = geojson_layer.marker_colour; |
|
| 89 |
} else {
|
|
| 90 |
var colour = getDottedPropertyValue(feature.properties, geojson_layer.marker_colour); |
|
| 91 |
} |
|
| 92 |
var markerStyles = "background-color: " + colour + ";"; |
|
| 80 | 93 |
marker = L.divIcon({
|
| 81 | 94 |
iconAnchor: [0, 0], |
| 82 | 95 |
popupAnchor: [5, -45], |
| ... | ... | |
| 89 | 102 |
return L.marker(latlng, {icon: marker});
|
| 90 | 103 |
}, |
| 91 | 104 |
style: function (feature) {
|
| 92 |
return {weight: 2, color: geojson_layer.marker_colour, fillColor: geojson_layer.marker_colour};
|
|
| 105 |
if (geojson_layer.marker_colour[0] == '#') {
|
|
| 106 |
var colour = geojson_layer.marker_colour; |
|
| 107 |
} else {
|
|
| 108 |
var colour = getDottedPropertyValue(feature.properties, geojson_layer.marker_colour); |
|
| 109 |
} |
|
| 110 |
return {weight: 2, color: colour, fillColor: colour};
|
|
| 93 | 111 |
} |
| 94 | 112 |
}); |
| 95 | 113 | |
| combo/apps/maps/templates/maps/colour_or_text_input.html | ||
|---|---|---|
| 1 |
{% load i18n %}
|
|
| 2 |
{% with widget_value=widget.value|stringformat:'s' %}
|
|
| 3 |
{% spaceless %}
|
|
| 4 |
<span id="{{ widget.name }}-joined-buttons" class="gadjo-joined-buttons">
|
|
| 5 |
<button data-mode="color" {% if widget.value is None or widget_value|slice:":1" == '#' %}class="pressed"{% endif %} role="button">{% trans "Colour" %}</button>
|
|
| 6 |
<button data-mode="text" {% if widget.value != None and widget_value|slice:":1" != '#' %}class="pressed"{% endif %} role="button">{% trans "Property" %}</button>
|
|
| 7 |
</span> |
|
| 8 |
{% endspaceless %}
|
|
| 9 |
<input id="{{ widget.name }}-input" {% if widget.value is None or widget_value|slice:":1" == '#' %}type="color"{% else %}type="text"{% endif %} name="{{ widget.name }}"{% if widget.value != None %} value="{{ widget_value }}"{% endif %}{% include "django/forms/widgets/attrs.html" %}>
|
|
| 10 |
{% endwith %}
|
|
| 11 |
<script> |
|
| 12 |
$(function() {
|
|
| 13 |
$('#{{ widget.name }}-joined-buttons button').on('click', function() {
|
|
| 14 |
var $current_mode = $('#{{ widget.name }}-joined-buttons button.pressed');
|
|
| 15 |
$current_mode.data('previous-value', $('#{{ widget.name }}-input').val());
|
|
| 16 |
if ($(this).is('.pressed')) {
|
|
| 17 |
$('#{{ widget.name }}-joined-buttons button').addClass('pressed');
|
|
| 18 |
$(this).removeClass('pressed');
|
|
| 19 |
} else {
|
|
| 20 |
$('#{{ widget.name }}-joined-buttons button').removeClass('pressed');
|
|
| 21 |
$(this).addClass('pressed');
|
|
| 22 |
} |
|
| 23 |
var $new_mode = $('#{{ widget.name }}-joined-buttons button.pressed');
|
|
| 24 |
var mode = $new_mode.data('mode');
|
|
| 25 |
$('#{{ widget.name }}-input').prop('type', mode).val($new_mode.data('previous-value'));
|
|
| 26 |
return false; |
|
| 27 |
}); |
|
| 28 |
}); |
|
| 29 |
</script> |
|
| combo/manager/static/css/combo.manager.css | ||
|---|---|---|
| 673 | 673 |
display: flex; |
| 674 | 674 |
justify-content: space-between; |
| 675 | 675 |
} |
| 676 | ||
| 677 |
#marker_colour-joined-buttons {
|
|
| 678 |
margin: 4px 0; |
|
| 679 |
} |
|
| 676 |
- |
|