Forráskód Böngészése

Reubicado controlador y routing en MapBundle

Daniel Libonati 8 éve
szülő
commit
18f85e76e6

+ 13 - 10
Controller/LeafletController.php

@@ -10,7 +10,7 @@ use Sonata\AdminBundle\Admin\Pool;
 
 class LeafletController extends Controller
 {
-    
+
     public function createVectorAction($layerId = 1, Request $request)
     {
 
@@ -29,12 +29,12 @@ class LeafletController extends Controller
                 foreach($_layers as $k => $l) {
                     if($l->getId() == $layerId) continue;
                     $_vectors = $l->getVectors();
-                    
+
                     foreach($_vectors as $k => $v) {$vectorsPopup[] = $v;}
-                    
+
                     $layers[] = array('name' => $l->getName(),'vectors'=>$_vectors);
                 }
-                
+
                 $map = $layer->getMap()->jsonExtraData();
             }
             $vectors = $em->getRepository("MapBundle\Entity\Vector")->findByLayer($layer);
@@ -62,7 +62,7 @@ class LeafletController extends Controller
 
 
     }
-    
+
     public function saveVectorAction(Request $request)
     {
         print_r($request->request->all());
@@ -78,18 +78,20 @@ class LeafletController extends Controller
         }
 
         $layers = array();
-        
+
         $em = $this->get('doctrine')->getManager();
         $map = $em->getRepository("MapBundle\Entity\Map")->findOneById($mapId);
 
+        $objectClasses = $em->getRepository("MapBundle\Entity\ObjectClass")->findAll();
+
         $_layers = $map->getLayers();
         foreach($_layers as $k => $l) {
             $_vectors = $l->getVectors();
             $layers[] = array('name' => $l->getName(),'vectors'=>$_vectors);
         }
-        
+
         $map = $map->jsonExtraData();
-        
+
         $adminPool = $this->get('sonata.admin.pool');
 
         return $this->render('LeafletBundle:Leaflet:show_map.html.twig', array(
@@ -97,9 +99,10 @@ class LeafletController extends Controller
             'admin_pool' => $adminPool,
             'admin' => $adminPool->getAdminByClass("MapBundle\Entity\Map"),
             'map'   => $map,
-            'layers' => $layers
+            'layers' => $layers,
+            'objectClasses' => $objectClasses
             ));
 
 
     }
-}
+}

+ 0 - 19
Resources/config/routing/admin.xml

@@ -1,19 +0,0 @@
-<?xml version="1.0" encoding="UTF-8" ?>
-
-<routes xmlns="http://symfony.com/schema/routing"
-    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
-    xsi:schemaLocation="http://symfony.com/schema/routing http://symfony.com/schema/routing/routing-1.0.xsd">
-
-    <route id="admin_leaflet_vector_create" path="/admin/leaflet/vector/create/{layerId}">
-        <default key="_controller">LeafletBundle:Leaflet:createVector</default>
-        <default key="layerId">1</default>
-    </route>
-    
-    <route id="admin_leaflet_vector_save" path="/admin/leaflet/vector/save">
-        <default key="_controller">LeafletBundle:Leaflet:saveVector</default>
-    </route>
-
-    <route id="admin_leaflet_map_show" path="/admin/leaflet/map/show/{mapId}">
-        <default key="_controller">LeafletBundle:Leaflet:showMap</default>
-    </route>
-</routes>

+ 0 - 748
Resources/views/Leaflet/show_map.html.twig

@@ -1,748 +0,0 @@
-{% extends 'SonataAdminBundle:CRUD:base_list.html.twig' %}
-
-{% block stylesheets %}
-{{ parent() }}
-<style>
-.no_checkbox>i.jstree-checkbox
-{
-    display:none
-}
-</style>
-<link rel="stylesheet" href="/css/tree/proton/style.css" />
-{% endblock %}
-
-{% block actions %}
-{% endblock %}
-
-{% block tab_menu %}
-{#{{ knp_menu_render(admin.sidemenu(action), {'currentClass' : 'active', 'template': sonata_admin.adminPool.getTemplate('tab_menu_template')}, 'twig') }}#}
-{% endblock %}
-
-{% block list_filters_actions %}
-{% endblock %}
-
-{% block list_filters %}
-{% endblock %}
-
-{% block list_table %}
-
-{% include 'LeafletBundle:Leaflet:resources.html.twig' %}
-
-<script type="text/javascript">
-    window.SONATA_CONFIG.USE_ICHECK = false;
-    window.currentLayer = null; // Almacena el ID del layer actualmente seleccionado.
-
-    var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
-            osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
-            osm = L.tileLayer(osmUrl, { maxZoom: 18, attribution: osmAttrib }),
-            map = new L.Map('map', { center: new L.LatLng({{map['lat']}}, {{map['lng']}}), zoom: {{map['zoom']}} });
-
-    var controlLayers = L.control.layers({
-        'OSM': osm.addTo(map),
-        "Google": L.tileLayer('http://www.google.cn/maps/vt?lyrs=s@189&gl=cn&x={x}&y={y}&z={z}', {
-            attribution: 'google'
-        })
-    }, {}, { position: 'topleft', collapsed: false });
-
-    addLayersMap();
-
-    controlLayers.addTo(map);
-
-    // Agregar Clase para dibujo de vectores
-    window.drawControl = new L.Control.Draw();
-
-    map.on(L.Draw.Event.CREATED, function (event) {
-        /* Se dispara tras creación de vector */
-        var uuid = guid();
-        var layer = event.layer;
-        var currentLayer = layers[window.currentLayer];
-
-        layer.layerType = event.layerType;
-        layer.layerClass = "vector";
-        currentLayer.addLayer(layer);
-
-        currentLayer.eachLayer(function(layer) {
-            if (typeof layer._uuid === 'undefined') {
-                layer._uuid = uuid + "_" + layer._leaflet_id;
-            }
-        });
-
-        saveData();
-        refresh();
-    });
-
-    map.on(L.Draw.Event.DELETED, function (event) {
-        /* Se dispara tras borrado de vector */
-        var layers = event.layers;
-        var deleteLayers = new Array();
-        layers.eachLayer(function(layer) {
-            deleteLayers.push(layer._uuid);
-        });
-
-        sendData = {'layerId' : layerId, 'vectors' : deleteLayers};
-        var json = JSON.stringify(sendData);
-
-        saveData();
-        refresh()
-
-    });
-
-function saveData()  {
-   /*
-    * Guarda todos los layers presentes en window.layers
-    * y a sus correspondientes vectores
-    */
-    $.each(window.layers, function(id, myLayer) {
-        var vectorData = new Array();
-        if (myLayer) {
-            myLayer.eachLayer(function(layer) {
-
-                if(layer.layerType == "marker") {
-                    data = [layer._latlng];
-                } else if (layer.layerType == "circle") {
-                    data = [layer._latlng, layer._mRadius];
-                } else if (layer.layerType == "polyline") {
-                    data = [layer._latlngs];
-                } else {
-                    data = [layer._latlngs[0]];
-                }
-
-                object = {'_uuid': layer._uuid, 'layerType': layer.layerType, 'data': data, 'layerId': layer._id};
-                vectorData.push(object);
-            });
-
-            sendData = {'layerId' : id, 'vectors' : vectorData};
-            var json = JSON.stringify(sendData);
-
-            $.ajax({
-                type: "POST",
-                url: "{{ path('admin_map_vector_create_ajax') }}",
-                data: json,
-                contentType: "application/json; charset=utf-8",
-                dataType: "json",
-                error: function(msg) {
-                    console.log(msg.msg);
-                }
-            });
-        }
-    });
-}
-
-function addLayersMap() {
-   /*
-    * Obtiene todos los layers y vectores de un mapa.
-    * Luego los agrega al control Leaflet
-    */
-    window.layers = new Array();
-
-    var url = window.location.pathname;
-    var id = url.substring(url.lastIndexOf('/') + 1);
-    var mapData = getData('maps', id );
-
-    for(var i=0; i < mapData.layers.length; i++) {
-
-        var layer = mapData.layers[i];
-        newLayer = L.featureGroup();
-
-        for(var j=0; j < layer.vectors.length; j++ ) {
-
-            var vector = layer.vectors[j];
-
-            _id = vector.id;
-            name = vector.name;
-            type = vector.type;
-            _uuid = vector.uuid;
-            data = JSON.parse(vector.data);
-            style = JSON.parse(vector.style);
-
-            if(type == "marker") {
-                if (typeof style.icon !== 'undefined') {
-                    icon = style.icon;
-                } else {
-                    icon = "miniBubbleBlueIcon";
-                }
-                object = new L.marker([data[0]['lat'], data[0]['lng']],{icon: eval(icon)});
-            } else if (type == "circle") {
-                object = new L.circle([data[0]['lat'], data[0]['lng']], data[1], style);
-            } else if (type == "polyline") {
-                object = new L.Polyline(data[0], style);
-            } else if (type == "rectangle"){
-                object = new L.Rectangle(data[0], style);
-            } else {
-                object = new L.Polygon(data[0], style);
-            }
-
-
-            object._id = _id;
-            object.name = name;
-            object._uuid = _uuid;
-            object.layerType = type;
-            object.layerClass = "vector";
-            var desc = $("#desc_vector_" + vector.id).html();
-
-            object.on("click", function (e) {
-                var layer = e.target
-
-                if (layer.class = 'vector') {
-                    // Deseleccionar todos los elementos.
-                    $('#jstree').jstree('deselect_all');
-                    $('#overlay_tree').jstree('deselect_all');
-
-                    for (key in layer._eventParents) {
-                        var leafletId = key;    // Debería iterar una sola vez
-                    }
-
-                    // Seleccionar elementos:
-                    for (key in window.layers) {
-                        if (window.layers[key]._leaflet_id == leafletId) {
-                            $('#jstree').jstree('select_node', key);
-                        }
-                    }
-
-                    /* Dar 200ms de espera, ya que esta instrucción puede ejecutarse
-                       incluso antes de que el árbol de vectores haya
-                       recibido la instrucción de recargarse. */
-                    setTimeout(function() { selectElement(layer._id) }, 200);
-                }
-
-            });
-
-            newLayer.class = 'layer';
-            newLayer.addLayer(object);
-        }
-
-        window.layers[layer.id] = newLayer.addTo(map);
-    }
-}
-
-</script>
-
-{% endblock %}
-
-{% block content %}
-<div class="col-md-10">
-    <div class="cms-block cms-block-element">
-        <div class="box">
-            <div class="box-body">
-                <div id="map" style="margin:0 auto; width: 100%; height: calc(100vh - 190px); border: 1px solid #ccc"></div>
-            </div>
-        </div>
-    </div>
-</div>
-<div class="col-md-2">
-    <div class="box">
-        <div class="box-header">
-            <h4>Capas</h4>
-            <div class="box-body">
-                <div class="jstree-proton" id="jstree" style="max-height: calc(100vh - 250px); overflow-y: auto; overflow-x: hidden;"></div>
-            </div>
-            <button class="btn btn-default btn-xs" id="btnNewLayer"><i class="fa fa-file-o" data-toggle="modal" data-target="#modalNewLayer"></i></button>
-            <button onclick="refresh()" class="btn btn-default btn-xs"><i class="fa fa-refresh" aria-hidden="true"></i></button>
-            <button id="btnSave" class="btn btn-default btn-xs"><i class="fa fa-floppy-o" aria-hidden="true"></i></button>
-        </div>
-    </div>
-    <div class="box">
-        <div class="box-header">
-            <h4>Elementos</h4>
-            <br/>
-            <div class="btn-group">
-                <button class="btn btn-default btn-xs" onclick="new L.Draw.Polyline(map, drawControl.options.polyline).enable();"><i class="fa fa-share-alt" aria-hidden="true"></i></button>
-                <button class="btn btn-default btn-xs" onclick="new L.Draw.Polygon(map, drawControl.options.polygon).enable();"><i class="fa fa-star-o" aria-hidden="true"></i></button>
-                <button class="btn btn-default btn-xs" onclick="new L.Draw.Rectangle(map, drawControl.options.rectangle).enable();"><i class="fa fa-stop" aria-hidden="true"></i></button>
-                <button class="btn btn-default btn-xs" onclick="new L.Draw.Circle(map, drawControl.options.circle).enable();"><i class="fa fa-circle-o" aria-hidden="true"></i></button>
-                <button class="btn btn-default btn-xs" onclick="new L.Draw.Marker(map, drawControl.options.marker).enable();"><i class="fa fa-map-marker" aria-hidden="true"></i></button>
-            </div>
-
-        </div>
-        <div class="box-body">
-            <div class="jstree-proton" id="overlay_tree" style="max-height: calc(100vh - 450px); overflow-y: auto; overflow-x: hidden;"></div>
-        </div>
-    </div>
-</div>
-
-
-<!-- Modal Nueva Capa -->
-<div class="modal fade" id="modalNewLayer" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
-    <div class="modal-dialog" role="document">
-        <div class="modal-content">
-            <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-                <h4 class="modal-title" id="myModalLabel">Nueva Capa</h4>
-            </div>
-            <div class="modal-body">
-                <div class="container-fluid">
-                    <label class="control-label col-md-3">Nombre</label>
-                    <input class="form-control col-md-9" name="name" id="newLayerName"></input>
-                </div>
-            </div>
-            <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
-                <button onclick="createNewLayer()" type="submit" class="btn btn-primary">Crear</button>
-            </div>
-        </div>
-    </div>
-</div>
-<!-- Fin - Modal Nueva Capa -->
-
-<!-- Modal Renombrar -->
-<div class="modal fade" id="modalRename" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
-    <div class="modal-dialog" role="document">
-        <div class="modal-content">
-            <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-                <h4 class="modal-title" id="myModalLabel">Renombrar</h4>
-            </div>
-            <div class="modal-body">
-                <div class="container-fluid">
-                    <label class="control-label col-md-3">Nombre</label>
-                    <input class="form-control col-md-9" name="name" id="newName"></input>
-                </div>
-            </div>
-            <div class="modal-footer">
-                <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
-                <button onclick="renameItem()" type="submit" class="btn btn-primary">Renombrar</button>
-            </div>
-        </div>
-    </div>
-</div>
-<!-- Fin - Modal Renombrar -->
-
-<!-- Modal Renombrar -->
-<div class="modal fade" id="modalDelete" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
-    <div class="modal-dialog modal-danger" role="document">
-        <div class="modal-content">
-            <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-                <h4 class="modal-title" id="myModalLabel">Borrar</h4>
-            </div>
-            <div class="modal-body">
-                <p>¿Está seguro de que desea borrar <span id="elementTypeCaption"?></span> "<span id="elementName"></span>"?</p>
-            </div>
-            <div class="modal-footer">
-                <button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button>
-                <button onclick="deleteItem()" type="submit" class="btn btn-danger">Borrar</button>
-            </div>
-        </div>
-    </div>
-</div>
-<!-- Fin - Modal Renombrar -->
-
-{% endblock %}
-
-
-
-
-
-
-{% block javascripts %}
-{{ parent() }}
-<script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.3.4/jstree.min.js"></script>
-<script>
-
-$(document).ready(function() {
-
-    $('#btnSave').click(function() {
-        /*
-         * Desactiva la edición en todas las capas,
-         * luego postea los datos existentes.
-         */
-        $.each(window.layers, function(id, myLayer) {
-            if (myLayer) {
-                myLayer.eachLayer(function(layer) {
-                    layer.editing.disable();
-                });
-            }
-        });
-
-        saveData();
-    });
-
-    // Defaults para el plugin JSTree
-    $.jstree.defaults.core.dblclick_toggle = false;
-    $.jstree.defaults.core.multiple = false;
-    $.jstree.defaults.checkbox.three_state = false;
-    $.jstree.defaults.checkbox.whole_node = false;
-    $.jstree.defaults.checkbox.tie_selection = false;
-    $.jstree.defaults.contextmenu.select_node = true;
-
-    $('#jstree').on('check_node.jstree uncheck_node.jstree', function (e, data) {
-        if (data.node.type == 'layer') {
-            if (data.node.state.checked) {
-                map.addLayer(layers[data.node.id]);
-            } else {
-                map.removeLayer(layers[data.node.id]);
-            }
-        }
-    });
-
-    $('#jstree').on('select_node.jstree', function (e, data) {
-        if (data.node.type == 'layer') {
-            window.currentLayer = data.selected;
-            $('#overlay_tree').jstree(true).settings.core.data = makeOverlayTree(layers[data.selected]);
-            $('#overlay_tree').jstree(true).refresh();
-        }
-        toggleControls();
-    });
-
-    $('#overlay_tree').on('select_node.jstree', function (e, data) {
-        var vectorData = getData('vectors', data.node.id);
-        map.eachLayer(function(layer){
-            if (layer._id == data.node.id) {
-                var popupContent = "<b>" + vectorData.name + "</b><br/>" + vectorData.description + " <div style='text-align:center;margin-top:5px'><a target='_blank' href='/admin/map/vector/" + vectorData.id + "/edit'>EDITAR</a></div>";
-                layer.bindPopup(popupContent);
-                if (!layer._popup.isOpen()) {
-                    layer.openPopup();
-                }
-            }
-        });
-    })
-
-    initializeTrees();
-});
-
-function getData(entity, id=null) {
-
-    /*
-     * Dadas una entidad y opcionalmente un id, devuelve un JSON obtenido
-     * mediante una llamada AJAX a la API REST.
-     */
-
-    var result = null;
-
-    if (id == null) {
-        var url = "/api/" + entity
-    } else {
-        var url = "/api/" + entity + "/" + id
-    }
-
-    $.ajax({
-        type: "GET",
-        dataType: "json",
-        async: false,
-        cache: false,
-        url: url,
-        success: function(data){
-            result = data;
-        },
-        error: function(XMLHttpRequest, textStatus, errorThrown) {
-            console.log("Status: " + textStatus); alert("Error: " + errorThrown);
-        }
-    });
-
-    return result;
-
-}
-
-function makeTree() {
-
-    /*
-     * Función que obtiene la información de las capas y se la entrega
-     * procesada al JSTree de capas.
-     */
-
-    var url = window.location.pathname;
-    var id = url.substring(url.lastIndexOf('/') + 1);
-    var mapData = getData('maps', id );
-    var result = [];
-
-    result.push({ "id" : "map_" + mapData.id, "parent" : "#", "text" : mapData.name,
-                  "type": "map", a_attr: {class: "no_checkbox"}, state: { opened : true } });
-
-    for(var i = 0; i < mapData.layers.length; i++) {
-        var layer = mapData.layers[i];
-        result.push({ "id" : layer.id, "parent" : "map_" + mapData.id,
-                      "text" : layer.name, "type" : "layer", state: { checked : true } });
-    }
-
-    return result;
-}
-
-function makeOverlayTree(layer) {
-
-   /*
-    * Función que obtiene los vectores dentro de una capa y se los
-    * entrega procesados al JSTree de elementos.
-    */
-
-    result = [];
-
-    if (layer) {
-        var layerss = layer.getLayers();
-        for(var j = 0; j < layerss.length; j++) {
-            var vector = layerss[j];
-            result.push({ "id" :vector._id, "parent" : "#", "text" : vector.name,
-            "type": vector.layerType,  a_attr: {class: "no_checkbox"} });
-        };
-    }
-
-    return result;
-}
-
-function customMenu(node) {
-
-    var items = {
-        editItem: {
-            label: "Editar",
-            action: function () { treeMenuEdit(node) } // No pasar la función directamente, sino la ejecuta al hacer click.
-        },
-        renameItem: {
-            label: "Renombrar",
-            action: function () {
-                if (node.type == 'layer') {
-                    window.activeType = 'layer';
-                } else {
-                    window.activeType = 'vector';
-                }
-                window.activeId = node.id;
-                $("#newName").val(node.text);
-                $("#modalRename").modal();
-            }
-        },
-        deleteItem: {
-            label: "Borrar",
-            action: function () {
-                if (node.type == 'layer') {
-                    $("#elementTypeCaption").text('la capa');
-                    window.activeType = 'layer';
-                } else {
-                    $("#elementTypeCaption").text('el elemento');
-                    window.activeType = 'vector';
-                }
-                window.activeId = node.id;
-                $("#elementName").text(node.text);
-                $("#modalDelete").modal();
-            }
-        }
-    };
-
-    return items;
-}
-
-function treeMenuEdit(node) {
-    if (node.type == "layer") {
-        var editor = new L.EditToolbar.Edit(map, {
-                featureGroup: drawControl.options.featureGroup,
-                selectedPathOptions: drawControl.options.edit.selectedPathOptions
-            })
-    } else  {
-        var currentlayer = layers[[$('#jstree').jstree(true).get_selected()[0]]];
-        currentlayer.eachLayer(function(layer) {
-            if (layer._id == node.id) {
-                var vector = layer;
-                vector.editing.enable();
-            }
-        });
-    }
-}
-
-function guid() {
-  return s4() + s4() + '-' + s4() + '-' + s4() + '-' +
-    s4() + '-' + s4() + s4() + s4();
-}
-
-function s4() {
-  return Math.floor((1 + Math.random()) * 0x10000)
-    .toString(16)
-    .substring(1);
-}
-
-function initializeTrees() {
-
-   /*
-    * Inicializa los controles JSTree
-    */
-
-    $('#jstree').jstree({
-
-        'core' : {
-            "animation" : 200,
-            "check_callback" : true,
-            "data" : makeTree(),
-            "strings" : { 'Loading ...' : 'Cargando...' },
-        },
-
-        "types" : {
-            "map" : {
-              "icon" : "/images/tree/16x16/Map.png",
-              "valid_children" : ["layer"]
-            },
-            "layer" : {
-              "icon" : "/images/tree/16x16/Layers.png",
-              "valid_children" : ["vector","object"]
-            },
-            "#" : {
-                "valid_children" : []
-            }
-        },
-        "plugins" : [ "dnd", "contextmenu", "checkbox", "types", "changed", "wholerow" ],
-        contextmenu: {items: customMenu}
-    });
-
-    $('#overlay_tree').jstree({
-
-        'core' : {
-            "animation" : 0,
-            "check_callback" : false,
-            "data" : makeOverlayTree(),
-            "themes" : { "dots": false },
-            "strings" : { 'Loading ...' : 'Cargando...' },
-        },
-
-        "types" : {
-              "polygon" : {
-              "icon" : "/images/tree/16x16/Polygon.png",
-              "valid_children" : []
-            },
-            "circle" : {
-              "icon" : "/images/tree/16x16/Circle.png",
-              "valid_children" : []
-            },
-            "rectangle" : {
-              "icon" : "/images/tree/16x16/Rectangle.png",
-              "valid_children" : []
-            },
-            "polyline" : {
-              "icon" : "/images/tree/16x16/Polyline.png",
-              "valid_children" : []
-            },
-            "marker" : {
-              "icon" : "/images/tree/16x16/Marker.png",
-              "valid_children" : []
-            },
-            "#" : {
-                "valid_children" : []
-            }
-        },
-        "plugins" : [ "dnd", "contextmenu", "checkbox", "types", "changed", "wholerow" ],
-        contextmenu: {items: customMenu}
-    });
-}
-
-function createNewLayer() {
-
-    var url = window.location.pathname;
-    var mapid = parseInt(url.substring(url.lastIndexOf('/') + 1));
-    var name = $('#newLayerName').val();
-
-    sendData = {name: name, map: mapid};
-
-    $.ajax({
-        type: "POST",
-        url: "{{ path('post_layer') }}",
-        async: false,
-        data: JSON.stringify(sendData),
-        contentType: "application/json; charset=utf-8",
-        dataType: "json",
-        error: function(msg) {
-            console.log(msg.msg);
-        }
-    });
-
-    $('#modalNewLayer').modal('hide');
-    refresh();
-
-}
-
-function deleteItem() {
-   /*
-    * Dados el tipo de elemento y el id del mismo, realiza una petición HTTP
-    * a la API para que realice el borrado del mismo.
-    */
-
-    var itemId = window.activeId
-    var itemType = window.activeType
-
-    if (itemType == 'layer') {
-        var url = '/api/layers/' + itemId;
-    } else if (itemType == 'vector') {
-        var url = '/api/vectors/' + itemId;
-    }
-
-    $.ajax({
-        type: "DELETE",
-        url: url,
-        async: false,
-        contentType: "application/json; charset=utf-8",
-        dataType: "json",
-        error: function(msg) {
-            console.log(msg.msg);
-        }
-    });
-
-    $('#modalDelete').modal('hide');
-    refresh();
-}
-
-function renameItem() {
-   /*
-    * Dados el tipo de elemento y el id del mismo, realiza una petición HTTP
-    * a la API para cambiar el nombre.
-    */
-
-    var itemId = window.activeId
-    var itemType = window.activeType
-
-    if (itemType == 'layer') {
-        var url = '/api/layers/' + itemId;
-    } else if (itemType == 'vector') {
-        var url = '/api/vectors/' + itemId;
-    }
-
-    sendData = {id: itemId, name: $('#newName').val()};
-
-    $.ajax({
-        type: "PATCH",
-        url: url,
-        async: false,
-        data: JSON.stringify(sendData),
-        contentType: "application/json; charset=utf-8",
-        dataType: "json",
-        error: function(msg) {
-            console.log(msg.msg);
-        }
-    });
-
-    $('#modalRename').modal('hide');
-
-    refresh();
-}
-
-function refresh() {
-    /* Recarga todos los elementos */
-
-    map.eachLayer(function (layer) {
-        if (layer._url != "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png") { //TODO: Buscar otra manera de matchear el mapa base.
-            map.removeLayer(layer);
-        }
-    });
-    window.layers = null;   /* Destruir global */
-    addLayersMap();
-
-    $('#jstree').jstree(true).settings.core.data = makeTree();
-    $('#overlay_tree').jstree(true).settings.core.data = makeOverlayTree(null);
-    $('#jstree').jstree(true).refresh();
-}
-
-function selectElement(elementId) {
-   /*
-    * Espera (preventivamente) a que los elementos se carguen e intenta
-    * seleccionar el elemento en cuestión
-    */
-
-    if ($('#overlay_tree').jstree().is_loading()) {
-        window.setTimeout(waitForLoad, 100); /* Reintenta en 100ms si está cargando */
-    } else {
-        $('#overlay_tree').jstree('select_node', elementId);
-    }
-}
-
-function toggleControls() {
-    if ($('#overlay_tree').jstree('get_selected') == '[]') {
-        $('#btnSave').prop('disabled', 'disabled');
-    } else {
-        $('#btnSave').removeProp('disabled');
-    }
-}
-
-</script>
-{% endblock %}