Produits Entr'ouvert » Combo

# -*- coding: utf-8 -*-

from __future__ import unicode_literals

from django.db import migrations, models

class Migration(migrations.Migration):

    dependencies = [

        ('auth', '0006_require_contenttypes_0002'),

        ('data', '0025_jsoncell_varnames_str'),

        ('maps', '0001_initial'),

    ]

    operations = [

        migrations.CreateModel(

            name='MapCell',

            fields=[

                ('id', models.AutoField(verbose_name='ID', serialize=False, auto_created=True, primary_key=True)),

                ('placeholder', models.CharField(max_length=20)),

                ('order', models.PositiveIntegerField()),

                ('slug', models.SlugField(verbose_name='Slug', blank=True)),

                ('extra_css_class', models.CharField(max_length=100, verbose_name='Extra classes for CSS styling', blank=True)),

                ('public', models.BooleanField(default=True, verbose_name='Public')),

                ('restricted_to_unlogged', models.BooleanField(default=False, verbose_name='Restrict to unlogged users')),

                ('last_update_timestamp', models.DateTimeField(auto_now=True)),

                ('title', models.CharField(max_length=150, verbose_name='Title', blank=True)),

                ('default_position', models.CharField(default=b'48.83369263315934;2.3233688436448574', max_length=128, blank=True, help_text=b'geographical coords', null=True, verbose_name='Default position')),

                ('initial_zoom', models.CharField(default=b'13', max_length=2, verbose_name='Initial zoom level', choices=[(b'0', 'Whole world'), (b'9', 'Wide area'), (b'11', 'Area'), (b'13', 'Town'), (b'16', 'Small road'), (b'19', 'Ant')])),

                ('min_zoom', models.CharField(default=b'0', max_length=2, verbose_name='Minimal zoom level', choices=[(b'0', 'Whole world'), (b'9', 'Wide area'), (b'11', 'Area'), (b'13', 'Town'), (b'16', 'Small road'), (b'19', 'Ant')])),

                ('max_zoom', models.CharField(default=19, max_length=2, verbose_name='Maximal zoom level', choices=[(b'0', 'Whole world'), (b'9', 'Wide area'), (b'11', 'Area'), (b'13', 'Town'), (b'16', 'Small road'), (b'19', 'Ant')])),

                ('groups', models.ManyToManyField(to='auth.Group', verbose_name='Groups', blank=True)),

                ('layer', models.ManyToManyField(to='maps.MapLayer')),

                ('page', models.ForeignKey(to='data.Page')),

            ],

            options={

                'verbose_name': 'Map Cell',

            },

        ),

    ]

from django.core.urlresolvers import reverse_lazy

from django import forms

from django import template

from combo.data.models import CellBase

from combo.data.library import register_cell_class

zoom_levels = [ ('0', _('Whole world')),

                ('9', _('Wide area')),

                ('11', _('Area')),

                ('13', _('Town')),

                ('16', _('Small road')),

                ('19', _('Ant')),]

class MapWidget(forms.TextInput):

    template_name = 'maps/map_widget.html'

    def render(self, name, value, attrs):

        final_attrs = self.build_attrs(attrs, name=name, value=value,

                                       type='hidden')

        cell_form_template = template.loader.get_template(self.template_name)

        return cell_form_template.render(final_attrs)

@register_cell_class

class MapCell(CellBase):

    title = models.CharField(_('Title'), max_length=150, blank=True)

    default_position = models.CharField(_('Default position'), null=True, blank=True,

                                        default='48.83369263315934;2.3233688436448574',

                                        max_length=128)

    initial_zoom = models.CharField(_('Initial zoom level'), max_length=2,

                                    choices=zoom_levels, default='13')

    min_zoom = models.CharField(_('Minimal zoom level'), max_length=2,

                                   choices=zoom_levels, default='0')

    max_zoom = models.CharField(_('Maximal zoom level'), max_length=2,

                                choices=zoom_levels, default=19)

    layer = models.ManyToManyField(MapLayer, verbose_name=_('Layers'))

    template_name = 'maps/mapcell.html'

    class Meta:

        verbose_name = _('Map Cell')

    class Media:

        js = ('xstatic/leaflet.js', 'js/map.js')

        css = {'all': ('xstatic/leaflet.css', 'xstatic/css/font-awesome.min.css',

                       'css/map.css')}

    def get_default_form_class(self):

        fields = ('title', 'default_position', 'initial_zoom', 'min_zoom',

                  'max_zoom', 'layer')

        lat, lng = self.default_position.split(';')

        widgets = {'layer': forms.widgets.CheckboxSelectMultiple,

                   'default_position': MapWidget(attrs={'init_lat': lat,

                                                        'init_lng': lng})}

        return forms.models.modelform_factory(self.__class__, fields=fields,

                                             widgets=widgets)

    @classmethod

    def is_enabled(cls):

        return MapLayer.objects.count() > 0

    def get_cell_extra_context(self, context):

        ctx = super(MapCell, self).get_cell_extra_context(context)

        ctx['title'] = self.title

        ctx['initial_lat'], ctx['initial_lng'] = self.default_position.split(';');

        ctx['initial_zoom'] = self.initial_zoom

        ctx['min_zoom'] = self.min_zoom

        ctx['max_zoom'] = self.max_zoom

        ctx['geojson_url'] = reverse_lazy('cell-geojson', kwargs={'cell_id': self.pk})

        return ctx

div#mapcell {

    height: 60vh;

}

/* leaflet styles */

div.leaflet-div-icon span {

    width: 2.3rem;

    height: 2.3rem;

    display: block;

    left: -1rem;

    top: -1rem;

    position: relative;

    border-radius: 11rem 6rem 0.8rem;

    transform: scale(1, 1.3) rotate(45deg);

    border: 1px solid #aaa;

}

div.leaflet-popup-content span {

    display: block;

}

div.leaflet-popup-content span.field-label {

    font-weight: bold;

    text-transform: capitalize;

}

div.leaflet-div-icon span i:before {

    display: inline-block;

    margin: 7px 8px;

    transform: scale(1.1) rotate(-45deg);

}

$(window).on('load', function() {

    $('div#mapcell_widget').each(function() {

        var $map_widget = $(this);

        var map_options = Object();

        map_options.zoom = 13;

        var map = L.map($(this).attr('id'), map_options);

        map.marker = null;

        latlng = [$map_widget.data('init-lat'), $map_widget.data('init-lng')];

        map.marker = L.marker(latlng);

        map.marker.addTo(map);

        map.setView(latlng, map_options.zoom);

        L.tileLayer(

            'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',

            {

                attribution: 'Map data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'

            }).addTo(map);

    })

});

$(window).on('load', function() {

    $('div#mapcell').each(function() {

        var $map_widget = $(this);

        var map_options = Object();

        var initial_zoom = parseInt($map_widget.data('initial-zoom'));

        if (! isNaN(initial_zoom)) {

            map_options.zoom = initial_zoom;

        } else {

            map_options.zoom = 13;

        }

        var max_zoom = parseInt($map_widget.data('max_zoom'));

        if (!isNaN(max_zoom)) map_options.maxZoom = max_zoom;

        var min_zoom = parseInt($map_widget.data('min-zoom'));

        if (!isNaN(min_zoom)) map_options.minZoom = min_zoom;

        var latlng = [$map_widget.data('init-lat'), $map_widget.data('init-lng')];

        var geojson_url = $map_widget.data('geojson-url');

        var map = L.map($(this).attr('id'), map_options);

        var store_position_selector = $map_widget.data('store-position');

        map.setView(latlng, map_options.zoom);

        L.tileLayer(

            'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',

            {

                attribution: 'Map data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>'

            }).addTo(map);

        if (store_position_selector) {

            map.marker = L.marker(latlng);

            map.marker.addTo(map);

            var hidden = $('input#' + store_position_selector);

            map.on('click', function(e) {

                map.marker.setLatLng(e.latlng);

                hidden.val(e.latlng.lat + ';' + e.latlng.lng);

            });

        }

        if (geojson_url) {

            $.getJSON(geojson_url, function(data) {

                var geo_json = L.geoJson(data, {

                    onEachFeature: function(feature, layer) {

                        if (feature.display_fields) {

                            var popup = '';

                            $.each(feature.display_fields, function(key, value) {

                                popup += '<p class="popup-field"><span class="field-label">' + key + '</span>';

                                popup += '<span class="field-value">' + value + '</span></p>';

                            });

                        } else {

                            var popup = '<p class="popup-field">' + feature.properties.label + '</p>';

                        }

                        layer.bindPopup(popup);

                    },

                    pointToLayer: function (feature, latlng) {

                        var markerStyles = "background-color: "+feature.properties.colour+";";

                        marker = L.divIcon({iconAnchor: [0, 24],

                                            html: '<span style="' + markerStyles + '"><i class="'+feature.properties.icon+'" style="color:'+feature.properties.icon_colour+'"></i></span>'});

                        return L.marker(latlng, {icon: marker});

                    }

                });

                map.fitBounds(geo_json.getBounds());

                geo_json.addTo(map);

            });

        }

    });

});

<div id="mapcell" data-init-lat="{{ init_lat }}" data-init-lng="{{ init_lng }}" data-store-position="{{ id }}">

</div>

<input type="{{ type }}" name="{{ name }}" value="{{ value }}" id="{{ id }}" />

{% load i18n %}

<h2>{{ title }}</h2>

<div id="mapcell" data-initial-zoom="{{ initial_zoom }}" data-min-zoom="{{ min_zoom }}" data-max-zoom="{{ max_zoom }}" data-init-lat="{{ initial_lat }}" data-init-lng="{{ initial_lng }}" data-geojson-url="{{ geojson_url }}">

</div>

from .views import GeojsonView

    url(r'^maps/geojson/(?P<cell_id>\w+)/$', GeojsonView.as_view(),

        name='cell-geojson'),

import json

from django.views.generic.base import View

from django.http import HttpResponse

from combo.utils import requests

from .models import MapCell

class GeojsonView(View):

    def get(self, request, *args, **kwargs):

        cell = MapCell.objects.get(pk=kwargs['cell_id'])

        geojson = {'type': 'FeatureCollection', 'features': []}

        for layer in cell.layer.all():

            geojson['features'] += layer.get_geojson()

        content_type = 'application/json'

        return HttpResponse(json.dumps(geojson), content_type=content_type)

<link rel="stylesheet" type="text/css" media="all" href="{% static "xstatic/leaflet.css" %}"></script>

<link rel="stylesheet" type="text/css" media="all" href="{% static "css/map.css" %}"></script>

<script src="{% static "xstatic/leaflet.js" %}"></script>

<script src="{% static "js/map.js" %}"></script>

    'xstatic.pkg.leaflet',

    'xstatic.pkg.font_awesome',

    python-xstatic-leaflet,

        'XStatic-Leaflet',