guiBlocks.prototype.addMapBlock = function(url, baseId, params, firstLayer) {
    var block = this.addBlock(url, baseId, params, function() {
        // function after add block finished
        console.debug("in mapblock after block load!");
        var be = block.element;
        params = block.params;
        block.type = "map";
        params.type = "map";
        if (params.map_layers == null) {
            params.map_layers = [];
        }
        if (firstLayer != null) {
            block.appendMapLayer(firstLayer);
        }
        // show block
        block.showMapParams();
        $(be).fadeIn();

        // save map params in block.param -- too early
        //params = block.readLayerParams();
        
        // load map
        block.updateMap(be,params);
        
        // add layer button
        $(be).find(".layer_add_button").click(function() {
            console.debug("layer add");
            params = block.readMapParams();
            block.addMapLayer(be,params);
        });
        // update button
        $(be).find(".map_update_button").click(function() {
            console.debug("map update");
            params = block.readMapParams();
            block.updateMap(be,params);
        });
        // save button
        $(be).find(".map_save_button").click(function() {
            console.debug("map save. this=",this," block=",block);
            params = block.readMapParams(be,params);
            block.storeBlock("test1");
        });
    });
};

guiBlocks.Block.prototype.appendMapLayer = function(layerparams) {
    // add layer to this map
    var layerinfo = {display: true, layer:layerparams};
    var layers = this.params.map_layers;
    layers.push(layerinfo);
    // update indexes
    for (var i = 0; i < layers.length; i++) {
        layers[i].idx = i;
    }
    return this.params;
};

guiBlocks.Block.prototype.showMapParams = function(elem,params) {
    // create html with layer parameters from params
    var i = 0;
    if (elem == null) {
        elem = this.element;
    }
    if (params == null) {
        params = this.params;
    }
    $(elem).find(".map_name").val(params.name);
    var layers = params.map_layers;
    // remove old info
    $(elem).find(".map_layer_table .layer_info").remove();
    // write new info
    if (layers.length > 0) {
        var tmpl = $(elem).find(".layer_info_tmpl").tmpl(layers);
        $(elem).find(".map_layer_header").after(tmpl);
        // arm edit and delete buttons
        for (i = 0; i < layers.length; ++i)
            
            tmpl.find(".layer_edit_"+i).click(function() {
                blocks.addLayerBlock("blocks/layer.html?table="+escape(params.table),"layer", params)
        });
    }
};

guiBlocks.Block.prototype.readMapParams = function(elem,params) {
    // read layer parameters from html element and store in param
    if (elem == null) {
        elem = this.element;
    }
    if (params == null) {
        params = this.params;
    }
    params.name = $(elem).find(".map_name").val();
    var layers = params.map_layers;
    for (var i = 0; i < layers.length; i++) {
        layers[i].display = $(elem).find(".layer_display_"+i).attr("checked");
    }
    //params.position_field = $(elem).find(".map_position_select").val();
    //params.connect_line = $(elem).find(".layer_line_checkbox").attr("checked");
    return params;
};

guiBlocks.Block.prototype.updateMap = function(elem,map_params) {
    if (elem == null) {
        elem = this.element;
    }
    if (map_params == null) {
        map_params = this.params;
    }
    // update and draw the google map
    var le = $(elem).find(".map_box").get(0);
    // create empty map
    if (google != null) {
        var latlng = new google.maps.LatLng(29, 116);
        var mapOpts = {
                zoom: 5,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.TERRAIN
        };
        var map = new google.maps.Map(le, mapOpts);
        console.debug("new google map=",map," on el=",le);
    }
    // add the layers
    var layerList = map_params.map_layers;
    for (var i = 0; i < layerList.length; i++) {
        if (!layerList[i].display) {
            continue;
        }
        var params = layerList[i].layer;
        var paramstr = "format=KML_URL";
        if (params.position_field && params.position_field != "Default") {
            paramstr += "&gis_id_field="+params.position_field;
        }
        if (params.connect_line) {
            paramstr += "&connect_line="+params.connect_line;
        }
        var layerurl = "../db/RESTdb/db/public/" + escape(params.table) + "?" + paramstr;
        jQuery.get(layerurl, function(data, textStatus, XMLHttpRequest) {
            // function after load kml url finished
            console.debug("kml url loaded! this=", this, " data=", data, " ("+typeof(data)+")");
            if (typeof(data) == "string") {
                var kmlURL = data;
            } else {
                // broken, what now?
                return;
            }
            // render layer
            if (google != null) {
                var newMarker=new google.maps.KmlLayer(kmlURL);
                console.debug("new marker layer=",newMarker," map=",map);
                newMarker.setMap(map);
            }
        });
    }
};

guiBlocks.Block.prototype.addMapLayer = function(elem,params) {
    var block = this;
    // show list of layers, select and add to map
    var layerList = [];
    var $dlg = $(elem).find(".dialog.add_layer_select");
    var $sel = $dlg.find("select.add_layer_select");
    // fill list of layers
    blocks.loadListOfItems("test1", "layer", function(data) {
        console.debug("add layer list of items=",data);
        layerList = data;
        $sel.empty();
        for (var i=0; i < data.length; i++) {
            var key = data[i].key;
            var val = data[i].val;
            var name = val.name;
            console.debug("layer",i," key=",key," value=",name);
            $sel.append('<option value="'+key+'">'+name+'</option>');
        }
    });
    console.debug("dlg=",$dlg);
    $dlg.dialog({
        buttons: {
            "Ok": function() {
                var layerName = $(this).find(".add_layer_select").val();
                $(this).dialog("close");
                var layerParams = jQuery.grep(layerList, function(x){return (x.key == layerName);})[0].val;
                console.debug("addlayerok params=",layerParams);
                params = block.appendMapLayer(layerParams);
                block.showMapParams(elem, params);
                params = block.readMapParams();
                block.updateMap(elem,params);
            }, 
            "Cancel": function() { 
                $(this).dialog("close"); 
            } 
        }
    });
};