/*
    Editor takes a Segment that will be editted.
    The GPolyLine that makes up the segment is 
    All the points that are displayed with the segment sections are redisplayed with
    GMarkers so that the points are visible and clickable.
    All the SegmentSections are displayed with check boxes next to them
*/
/*
 * divId - The <div id='?'> that the editor is to use to display the text needed to 
 *         talk to the user.
 */
function SegmentEditor(divId) {
    this.htmlElement = document.getElementById(divId);
    if ( ! this.htmlElement ) {
        alert("No Element with id='"+divId+"'");
    }
}

/* */
SegmentEditor.prototype.clickOnMap = function (overlay, point) {
    var editor = map.sworddance_segmentEditor;
    
    if (editor ) {
        if (overlay) {
            var index = overlay.sworddance_segmentSection;
            if ( index ) {
                editor.clickOnOverlay(index, overlay);
            } else {
                // this overlay is not a special overlay, so ignore for now.
                
            }
        } else if (point) {
            editor.clickOnPoint(point);
        }
    }
}
/* 
 First click on overlay selects it for moving it,
 Second click selects for inserting after,
 Third click unselects it.
 */
SegmentEditor.prototype.clickOnOverlay = function(index, overlay) {
    if ( this.isEditing(index) ) {
        this.finishEditing();
        this.insertPoint(index);
    } else if ( this.isInserting(index) ) {
        this.finishInserting();
    } else {
        this.finishEditing();
        this.finishInserting();
        this.editPoint(index, overlay);
    }
}

/*
 * if a point is selected for moving then move selected marker,
 * if a point is selected for insertion then insert new point after original point 
 * and advance insertion marker.
 */
SegmentEditor.prototype.clickOnPoint = function(point) {
    if ( this.editPosition ) {
        this.replaceSection(point);
    } else if ( this.insertPosition ) {
        this.insertSection(point);        
    }        
}


/* attach to the map, convert all the points in the segment to markers so they
   can be clicked on.
*/
SegmentEditor.prototype.attachToMap = function (map) {
    // remove the fully rendered line.
    this.map = map;
    this.markers = [];
    this.lines = [];
    this.addSegmentOverlay();
    this.listenerMemento = GEvent.addListener(this.map, 'click', this.clickOnMap);
    this.map.sworddance_segmentEditor = this;
    this.generateHTML();
}

SegmentEditor.prototype.STATUS_ELEMENT_ID = 'sworddance_editor_status';
/*
generate the HTML needed to control the Editing of the Segment assigned to this editor
*/
SegmentEditor.prototype.generateHTML = function () {
    var html ="";
    var segmentSections = this.segment.getSections();
    for(var i = 0; i < segmentSections.length; i++) {
        html += "<br><input type='checkbox'/>"+segmentSections[i].latitude+","+segmentSections[i].longitude;
    }
    html+="<input type='Submit' value='Delete'/>";
    html+="<input type='Submit' value='Insert'/>";
    html+="<div id='"+this.STATUS_ELEMENT_ID+"'/>";
    this.htmlElement.innerHTML = html;
}

SegmentEditor.prototype.detachFromMap = function(map) {
    GEvent.removeListener(this.listenerMemento);
    delete this.listenerMemento;
    delete this.map;
    this.cancelEdit();
}
SegmentEditor.prototype.addSegmentOverlay = function() {
    // now generate the multiple lines that are editable.   
    var previousMarker; 
    var lastPoint;
    var sections = this.segment.getSections();
    for(var i=0 ; i < sections.length; i++) {
        var section = sections[i];
        var sectionPoints = section.getPoints();
        if ( i == 0) {
            // the first SegmentSection must be a simple point.
            // no radius information allowed.
            previousMarker = new GMarker(sectionPoints[0]);
            lastPoint = sectionPoints[0];
        } else {
            var points = [lastPoint].concat(sectionPoints);
            var line = new GPolyline(points, "#FFFFFF",4, 1.0);
            this.map.addOverlay(line);
            this.lines.push(line);
            lastPoint = sectionPoints[sectionPoints.length-1];
            previousMarker = new GMarker(lastPoint);
        }
        // save some information to make it easier to find the segment to use.
        previousMarker.sworddance_segmentSection = i;
        previousMarker.sworddance_segmentEditor = this;
        this.markers.push(previousMarker);
        this.map.addOverlay(previousMarker);
    }
}
SegmentEditor.prototype.removeSegmentOverlay = function() {
    for(var i = 0; i < this.markers.length; i++) {
        this.map.removeOverlay(this.markers[i]);
    }
    for(var i = 0; i < this.lines.length; i++) {
        this.map.removeOverlay(this.lines[i]);
    }
}
SegmentEditor.prototype.cancelEdit = function(map) {
    this.removeSegmentOverlay();
    map.addOverlay(this.segment.getLine());
    delete this.segment;
    delete this.lines;
    delete this.markers;
    this.finishEditing();
    this.finishInserting();
}

SegmentEditor.prototype.deletePoint = function(position) {
    var line = this.segment.getLine();
    this.map.removeOverlay(line);
    this.segment.removeSection(position);
    this.map.addOverlay(this.segment.getLine());
}

SegmentEditor.prototype.editPoint = function(position) {
    this.changeStatus('Editing position '+position);
    this.editPosition = position;
}

SegmentEditor.prototype.isEditing = function(position) {
    return this.editPosition == position;
}

SegmentEditor.prototype.isInserting = function(position) {
    return this.insertPosition == position;
}

SegmentEditor.prototype.insertPoint = function(position) {
    this.changeStatus('Inserting at position '+position);
    this.insertPosition = position;
}

SegmentEditor.prototype.insertSection = function(point) {
    this.removeSegmentOverlay();
    this.segment.insertSection(this.insertPosition, new SegmentSection(point));
    this.insertPosition++;
    this.addSegmentOverlay();
}
SegmentEditor.prototype.replaceSection = function(point) {
    this.removeSegmentOverlay();
    this.segment.replaceSection(this.editPosition, new SegmentSection(point));
    this.addSegmentOverlay();
}

SegmentEditor.prototype.deleteMarker = function() {
}

SegmentEditor.prototype.insertMarker = function() {
}

SegmentEditor.prototype.editMarkerComments = function() {
}

SegmentEditor.prototype.editSegmentData = function() {
}

SegmentEditor.prototype.finishEditing = function() {
    delete this.editPosition;
}
SegmentEditor.prototype.finishInserting = function() {
    delete this.insertPosition;
}

SegmentEditor.prototype.changeStatus = function(statusMsg) {
    document.getElementById(this.STATUS_ELEMENT_ID).innerHTML = statusMsg;
}