Changeset 33086

Show
Ignore:
Timestamp:
16.05.2019 20:07:59 (5 weeks ago)
Author:
wy59
Message:

1. Labels sort of work (see point 2) and get saved and reloaded from archives too now. 2. Needs fixing: undo and redo in label field works only if you enter the text first before drawing the shape, whereas vice-versa the redo/undo behaviour is weird (label repeated 3 times).

Files:
1 modified

Legend:

Unmodified
Added
Removed
  • main/trunk/greenstone3/web/interfaces/default/js/map-scripts-editor.js

    r33081 r33086  
    3737    this.resizable = false; 
    3838    this.dontResize = false; 
     39 
    3940    this.shapeOptions = { 
    4041        suppressUndo: true, 
     
    4445        editable: true, 
    4546        geodesic: false, 
    46         draggable: true 
     47        draggable: true, 
     48        description: "" 
    4749    }; 
    4850    this.mapEditorHistory = new MapEditorHistory(this); 
     
    8587         
    8688    thicknessSliderOutput.oninput = function () { 
    87         that.shapeSpecsChangeMD(); 
     89        that.shapeSpecsChangeMD(); // TODO: DO WE NEED THIS LINE? (LINE COPIED & PASTED FROM ABOVE) 
    8890        if(this.value > that.MAX_THICKNESS) this.value = that.MAX_THICKNESS; 
    8991        if(this.value < that.MIN_THICKNESS) this.value = that.MIN_THICKNESS; 
     
    107109    } 
    108110    opacitySliderOutput.oninput = function () { 
    109         that.shapeSpecsChangeMD(); 
     111        that.shapeSpecsChangeOnInput(); 
    110112        if(this.value > that.MAX_OPACITY) this.value = that.MAX_OPACITY; 
    111113        if(this.value < that.MIN_OPACITY) this.value = that.MIN_OPACITY; 
     
    116118    } 
    117119     
     120    var descriptionInput = document.getElementById("description" + "-" + this.id); 
     121    descriptionInput.oninput = function () {         
     122        that.shapeSpecsChangeOnInput(); // takes care of history (undo/redo)         
     123        var description = this.value; 
     124        that.shapeOptions.description = description;         
     125        that.setSelectedDescription(that.shapeOptions.description);         
     126    } 
     127     
     128    // TODO: Do we need these listeners, when we already have onInput methods above? Test. 
    118129    document.getElementById("color-palette1" + "-" + this.id).addEventListener("mousedown", function() { that.shapeSpecsChangeMD() }); 
    119130    document.getElementById("thicknessRange" + "-" + this.id).addEventListener("mouseup", function () { that.shapeSpecsChangeMU() }); 
    120     document.getElementById("colourOpacity" + "-" + this.id).addEventListener("mouseup", function() { that.shapeSpecsChangeMU() } ); 
     131    document.getElementById("colourOpacity" + "-" + this.id).addEventListener("mouseup", function () { that.shapeSpecsChangeMU() }); 
     132    //document.getElementById("description" + "-" + this.id).addEventListener("keypress", function () { that.shapeSpecsChangeOnInput() }); 
    121133 
    122134    document.onmousedown = function (ev) { 
     
    214226} 
    215227 
     228MapEditor.prototype.shapeSpecsChangeOnInput = function () { 
     229    if (this.selectedShapes.length > 0) { 
     230        this.mapEditorHistory.presentOverlayPush(); 
     231    } 
     232} 
     233 
    216234MapEditor.prototype.makeColorButton = function (color) { 
    217235    var that = this; 
     
    332350    // store reference to added overlay 
    333351    google.maps.event.addListener(this.drawingManager, 'overlaycomplete', function (e) { 
    334          
     352        document.getElementById("description" + "-" + that.id).value = ""; 
     353        var value = document.getElementById("description" + "-" + that.id).value; 
    335354        that.allowDeselect = true; 
    336355        that.mapEditorHistory.historyOverlayPush(); 
    337356        that.overlays.push(e.overlay); // store reference to added overlay 
    338357        var newShape = e.overlay; 
    339         newShape.type = e.type; 
     358        newShape.type = e.type;      
    340359        that.mapEditorHistory.presentOverlayPush(); 
    341360         
     
    389408            //disable keyboard shortcut within the number input field 
    390409            var activeElement = $(document.activeElement); 
    391             if(activeElement.attr('type') == 'number'){ 
     410            if(activeElement.attr('type') == 'number' || activeElement.attr('type') == 'text'){ 
    392411                //console.log('number detected') 
    393412                return; 
     
    517536 
    518537MapEditor.prototype.addShapeListeners = function (newShape, e) { 
    519     var that = this; 
     538    var that = this; 
    520539    // Add an event listener that selects the newly-drawn shape when the user 
    521540    // mouses down on it. 
     
    612631        //Send the values to be updated 
    613632        var thi = shape.strokeWeight; 
    614         var opa = shape.fillOpacity; 
     633        var opa = shape.fillOpacity;         
    615634        var fCol = shape.fillColor; 
    616635        var sCol = shape.strokeColor; 
    617         this.updateMenuValues(thi, opa, fCol, sCol); 
     636        var description = shape.description; 
     637        this.updateMenuValues(thi, opa, fCol, sCol, description); 
    618638 
    619639    } else if (shape.type == 'marker') { 
     
    636656} 
    637657 
     658//Set selected label 
     659MapEditor.prototype.setSelectedDescription = function (label) { 
     660    if (this.selectedShapes.length > 0) { 
     661        for (var i = 0; i < this.selectedShapes.length; i++) { 
     662            this.selectedShapes[i].set('description', label); //SAME: this.selectedShapes[i].description = label;             
     663        } 
     664    } 
     665} 
     666 
    638667//Set selected thickness 
    639668MapEditor.prototype.setSelectedThickness = function (sWeight) { 
     
    669698} 
    670699 
    671 MapEditor.prototype.updateMenuValues = function (thi, opa, fCol, sCol) {     
     700MapEditor.prototype.updateMenuValues = function (thi, opa, fCol, sCol, description) {    
    672701    //Update thickness slider and value on the settings menu 
    673702    var thicknessSliderOutput = document.getElementById("thicknessRangeVal" + "-" + this.id); 
     
    681710    opacitySliderOutput.value = opa * 100; 
    682711    document.getElementById("colourOpacity" + "-" + this.id).value = opa * 100; 
     712 
     713    // Show the description in the description field 
     714    var descriptionInput = document.getElementById("description" + "-" + this.id); 
     715    descriptionInput.value = description; 
    683716 
    684717    if (this.drawingManager.drawingMode == null) {