Changeset 32799

Show
Ignore:
Timestamp:
22.02.2019 11:22:03 (8 months ago)
Author:
ak19
Message:

Maps History transformed into a class and moved the cloning functions to "map-scripts-shapes-util.js"

Files:
1 modified

Legend:

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

    r32769 r32799  
    1 //var prevOverlays = []; 
    2 //var presentOverlays = []; 
    3 //var undoneOverlays = []; 
    4 //var cycleComplete = true; 
    5  
    6 function MapEditorHistory() 
    7 { 
     1 
     2function MapEditorHistory(mapEditor) { 
    83    this.prevOverlays = []; 
    94    this.presentOverlays = []; 
    105    this.undoneOverlays = []; 
    11     this.cycleComplete = true; 
    12 } 
    13  
    14 MapEditorHistory.prototype.undo = function() { 
    15     for (let i = 0; i < overlays.length; i++) { 
    16         overlays[i].setMap(null); 
     6    this.cycleCompvare = true; 
     7    this.mapEditor = mapEditor; 
     8} 
     9 
     10MapEditorHistory.prototype.undo = function () { 
     11     
     12    for (var i = 0; i < this.mapEditor.overlays.length; i++) { 
     13        this.mapEditor.overlays[i].setMap(null); 
    1714    } 
    1815    if (this.prevOverlays.length != 0) { 
    19         selectedShapes = []; 
    20         overlays = []; 
     16        this.mapEditor.selectedShapes = []; 
     17        this.mapEditor.overlays = []; 
    2118        this.undoneOverlaysPush(); 
    22         let prev_overlay = this.prevOverlays.pop(); 
    23  
     19        var prev_overlay = this.prevOverlays.pop(); 
     20        var draggableCB = document.querySelector("input[name=draggableCB]").checked = false; 
     21         
     22         
    2423        if (prev_overlay.length > 0) { 
    2524            for (var i = 0; i < prev_overlay.length; i++) { 
    26                 overlays[i] = prev_overlay[i]; 
    27                 overlays[i].setMap(map); 
    28                 overlays[i].draggable = draggableState; 
     25                this.mapEditor.overlays[i] = prev_overlay[i]; 
     26                this.mapEditor.overlays[i].setMap(this.mapEditor.map); 
     27                this.mapEditor.overlays[i].draggable = true; 
    2928            } 
    3029        } 
    3130    } 
    3231}; 
    33      
    34  
    35      
    36  
    37  
    38 MapEditorHistory.prototype.redo = function() { 
     32 
     33MapEditorHistory.prototype.redo = function () { 
    3934 
    4035    if (this.undoneOverlays.length != 0) { 
    41         selectedShapes = []; 
    42         for (let i = 0; i < overlays.length; i++) { 
    43             overlays[i].setMap(null); 
    44         } 
    45  
    46         overlays = []; 
     36        var draggableCB = document.querySelector("input[name=draggableCB]").checked = false; 
     37        this.mapEditor.selectedShapes = []; 
     38        for (var i = 0; i < this.mapEditor.overlays.length; i++) { 
     39            this.mapEditor.overlays[i].setMap(null); 
     40        } 
     41 
     42        this.mapEditor.overlays = []; 
    4743        var lastEntry = this.undoneOverlays[this.undoneOverlays.length - 1]; 
    48         for (let i = 0; i < lastEntry.length; i++) { 
    49             overlays[i] = lastEntry[i]; 
    50             overlays[i].setMap(map); 
    51             overlays[i].draggable = draggableState; 
     44        for (var i = 0; i < lastEntry.length; i++) { 
     45            this.mapEditor.overlays[i] = lastEntry[i]; 
     46            this.mapEditor.overlays[i].setMap(this.mapEditor.map); 
     47            this.mapEditor.overlays[i].draggable = true; 
    5248        } 
    5349 
     
    5854            } else { 
    5955                var overlays_copy = []; 
    60                 for (let i = 0; i < this.presentOverlays[0].length; i++) { 
    61                     var clone_shape = this.cloneShape(this.presentOverlays[0][i]); 
    62                     if (this.overlayItemIsShape(clone_shape)) { 
    63                         addShapeListeners(clone_shape, null); 
     56                for (var i = 0; i < this.presentOverlays[0].length; i++) { 
     57                    var clone_shape = ShapesUtil.cloneShape(this.presentOverlays[0][i]); 
     58                    if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     59                        this.mapEditor.addShapeListeners(clone_shape, null); 
    6460                    } else { 
    65                         addMarkerListeners(clone_shape, null); 
     61                        this.mapEditor.addMarkerListeners(clone_shape, null); 
    6662                    } 
    6763                    overlays_copy[i] = clone_shape; 
     
    7672} 
    7773 
    78  
    79  
    80  
    81 MapEditorHistory.prototype.clonePath = function(path){ 
     74/* 
     75MapEditorHistory.prototype.clonePath = function (path) { 
    8276    var clone_path = []; 
    8377 
     
    9589} 
    9690 
    97  
    98 MapEditorHistory.prototype.clonePolyline = function(polyline){ 
    99     var path = polyline.getPath(); 
     91MapEditorHistory.prototype.clonePolyline = function (polyline) { 
    10092    var geodesic = polyline.geodesic; 
    10193    var strokeColor = polyline.strokeColor; 
    10294    var strokeOpacity = polyline.strokeOpacity; 
    10395    var strokeWeight = polyline.strokeWeight; 
    104     var clone_path = clonePath(path); 
    105     //var editable      = rect.editable; 
    106  
     96    //var clone_path = clonePath(path); 
     97     
     98    var clone_path = null; 
     99     
     100    var JSONSave = typeof polyline.getPath !== "function"; 
     101    //console.log(JSONSave) 
     102    if(JSONSave){ 
     103        var path = polyline.latLngs.j[0].j; 
     104        clone_path = path; 
     105         
     106    } else{ 
     107        var path = polyline.getPath(); 
     108        clone_path = this.clonePath(path);   
     109    } 
    107110    var clone_polyline = new google.maps.Polyline({ 
    108111            geodesic: geodesic, 
     
    111114            strokeWeight: strokeWeight, 
    112115            path: clone_path, 
    113             draggable: draggableState, 
     116            draggable: true, 
    114117            editable: false 
    115118        }); 
     
    120123} 
    121124 
    122  
    123 MapEditorHistory.prototype.clonePolygon = function(polygon){ 
    124     var path = polygon.getPath(); 
     125MapEditorHistory.prototype.clonePolygon = function (polygon) { 
    125126    var geodesic = polygon.geodesic; 
    126127    var strokeColor = polygon.strokeColor; 
     
    129130    var fillColor = polygon.fillColor; 
    130131    var fillOpacity = polygon.fillOpacity; 
    131     var clone_path = clonePath(path); 
    132     //var editable      = rect.editable; 
    133  
     132 
     133    var clone_path = null; 
     134    var JSONSave = typeof polygon.getPath !== "function"; 
     135    //console.log(JSONSave) 
     136    if(JSONSave){ 
     137        var path = polygon.latLngs.j[0].j; 
     138        clone_path = path; 
     139         
     140    } else{ 
     141        var path = polygon.getPath(); 
     142        clone_path = this.clonePath(path); 
     143        console.log(path);   
     144    }    
    134145    var clone_polygon = new google.maps.Polygon({ 
    135146            geodesic: geodesic, 
     
    140151            fillOpacity: fillOpacity, 
    141152            path: clone_path, 
    142             draggable: draggableState, 
     153            draggable: true, 
    143154            editable: false 
    144155        }); 
    145  
    146156    clone_polygon.type = google.maps.drawing.OverlayType.POLYGON; 
    147  
    148157    return clone_polygon; 
    149158} 
    150159 
    151 MapEditorHistory.prototype.cloneRectangle = function(rect){ 
     160MapEditorHistory.prototype.cloneRectangle = function (rect) { 
    152161    var strokeColor = rect.strokeColor; 
    153162    var strokeOpacity = rect.strokeOpacity; 
     
    155164    var fillColor = rect.fillColor; 
    156165    var fillOpacity = rect.fillOpacity; 
    157     var bounds = rect.getBounds(); 
     166    //var bounds = rect.getBounds(); 
    158167    var type = rect.type; 
    159     //var editable      = rect.editable; 
    160  
     168     
     169    var bounds = null; 
     170     
     171    var JSONSave = typeof rect.getBounds !== "function"; 
     172     
     173    if(JSONSave){ 
     174        var north = rect.bounds.north; 
     175        var south = rect.bounds.south; 
     176        var east = rect.bounds.east; 
     177        var west = rect.bounds.west; 
     178        if (!isNaN(north) && !isNaN(south) && !isNaN(west) && !isNaN(east)) { 
     179            var NE = new google.maps.LatLng(north, east); 
     180            var SW = new google.maps.LatLng(south, west); 
     181            bounds = new google.maps.LatLngBounds(SW, NE); 
     182        }        
     183    } else { 
     184        bounds = rect.getBounds(); 
     185    } 
    161186    var clone_rect = new google.maps.Rectangle({ 
    162187            strokeColor: strokeColor, 
     
    166191            fillOpacity: fillOpacity, 
    167192            bounds: bounds, 
    168             draggable: draggableState, 
     193            draggable: true, 
    169194            editable: false, 
    170195            type: type 
     
    172197 
    173198    clone_rect.type = google.maps.drawing.OverlayType.RECTANGLE; 
    174  
    175199    return clone_rect; 
    176200} 
    177201 
    178 MapEditorHistory.prototype.cloneCircle = function(circ){ 
     202MapEditorHistory.prototype.cloneCircle = function (circ) { 
    179203    var strokeColor = circ.strokeColor; 
    180204    var strokeOpacity = circ.strokeOpacity; 
     
    184208    var center = circ.center; 
    185209    var radius = circ.radius; 
    186     //var editable      = rect.editable; 
    187  
     210     
    188211    var clone_circ = new google.maps.Circle({ 
    189212            strokeColor: strokeColor, 
     
    194217            center: center, 
    195218            radius: radius, 
    196             draggable: draggableState, 
     219            draggable: true, 
    197220            editable: false 
    198221        }); 
     
    203226} 
    204227 
    205 MapEditorHistory.prototype.cloneMarker = function(marker){ 
    206     var position = marker.getPosition(); 
     228MapEditorHistory.prototype.cloneMarker = function (marker) { 
    207229    var anchorPoint = marker.anchorPoint; 
     230    var JSONSave = typeof marker.getPosition !== "function"; 
     231    if(JSONSave){ 
     232        var position = marker.position; 
     233    } else{ 
     234        var position = marker.getPosition(); 
     235    } 
    208236    var clone_marker = new google.maps.Marker({ 
    209237            anchorPoint: anchorPoint, 
    210238            position: position, 
    211239            clickable: true, 
    212             draggable: draggableState, 
     240            draggable: true, 
    213241            editable: false 
    214242        }) 
     
    218246} 
    219247 
    220 MapEditorHistory.prototype.cloneShape = function(shape){ 
     248MapEditorHistory.prototype.cloneShape = function (shape) { 
    221249    if (shape.type === google.maps.drawing.OverlayType.POLYLINE) { 
    222         let clone_polyline = this.clonePolyline(shape); 
     250        var clone_polyline = this.clonePolyline(shape); 
    223251        return clone_polyline; 
    224252    } else if (shape.type === google.maps.drawing.OverlayType.POLYGON) { 
    225         let clone_polygon = this.clonePolygon(shape); 
     253        var clone_polygon = this.clonePolygon(shape); 
    226254        return clone_polygon; 
    227255    } else if (shape.type === google.maps.drawing.OverlayType.RECTANGLE) { 
    228         let clone_rect = this.cloneRectangle(shape); 
     256        var clone_rect = this.cloneRectangle(shape); 
    229257        return clone_rect; 
    230258 
    231259    } else if (shape.type === google.maps.drawing.OverlayType.CIRCLE) { 
    232         let clone_circ = this.cloneCircle(shape); 
     260        var clone_circ = this.cloneCircle(shape); 
    233261        return clone_circ; 
    234262 
    235263    } else { 
    236         let clone_marker = this.cloneMarker(shape); 
     264        var clone_marker = this.cloneMarker(shape); 
    237265        return clone_marker; 
    238266    } 
    239267} 
    240268 
    241 MapEditorHistory.prototype.overlayItemIsShape = function(overlay_item){ 
     269MapEditorHistory.prototype.overlayItemIsShape = function (overlay_item) { 
    242270    var type = overlay_item.type; 
    243271 
     
    249277    return is_shape; 
    250278} 
    251 MapEditorHistory.prototype.historyOverlayPush = function(){ 
    252     if (this.cycleComplete) { 
    253         var overlays_copy = []; 
    254         for (var i = 0; i < overlays.length; i++) { 
    255             let clone_shape = this.cloneShape(overlays[i]); 
    256  
    257             if (this.overlayItemIsShape(clone_shape)) { 
    258                 addShapeListeners(clone_shape, null); // don't have an overlay event! 
    259             } else { 
    260                 addMarkerListeners(clone_shape, null); // don't have an overlay event! 
    261             } 
    262             overlays_copy[i] = clone_shape; 
    263         } 
    264         undoneOverlays = []; 
     279 
     280*/ 
     281 
     282MapEditorHistory.prototype.historyOverlayPush = function () { 
     283     
     284     
     285    if (this.cycleCompvare) { 
     286         
     287        var overlays_copy = []; 
     288        for (var i = 0; i < this.mapEditor.overlays.length; i++) { 
     289            var clone_shape = ShapesUtil.cloneShape(this.mapEditor.overlays[i]); 
     290            if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     291                this.mapEditor.addShapeListeners(clone_shape, null); // don't have an overlay event! 
     292            } else { 
     293                this.mapEditor.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
     294            } 
     295            overlays_copy[i] = clone_shape; 
     296        } 
     297        this.undoneOverlays = []; 
    265298        this.prevOverlays.push(overlays_copy); 
    266299    } 
    267300 
    268     cycleComplete = false; 
    269 } 
    270  
    271 MapEditorHistory.prototype.presentOverlayPush = function(){ 
     301    this.cycleCompvare = false; 
     302} 
     303 
     304MapEditorHistory.prototype.presentOverlayPush = function () { 
     305//  console.log("presentOverlayPush"); 
     306     
    272307    this.presentOverlays = []; 
    273308    var overlays_copy = []; 
    274     for (var i = 0; i < overlays.length; i++) { 
    275         let clone_shape = this.cloneShape(overlays[i]); 
    276         if (this.overlayItemIsShape(clone_shape)) { 
    277             addShapeListeners(clone_shape, null); // don't have an overlay event! 
     309    for (var i = 0; i < this.mapEditor.overlays.length; i++) { 
     310        var clone_shape = ShapesUtil.cloneShape(this.mapEditor.overlays[i]); 
     311        if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     312            this.mapEditor.addShapeListeners(clone_shape, null); // don't have an overlay event! 
    278313        } else { 
    279             this.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
     314            this.mapEditor.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
    280315        } 
    281316        overlays_copy[i] = clone_shape; 
    282317    } 
    283318    this.presentOverlays.push(overlays_copy); 
    284     cycleComplete = true; 
    285  
    286 } 
    287  
    288 MapEditorHistory.prototype.undoneOverlaysPush = function(){ 
    289 presentOverlayPush 
    290     var conditionUndone = presentOverlays[presentOverlays.length - 1] !== undefined; 
     319    this.cycleCompvare = true; 
     320 
     321     
     322} 
     323 
     324MapEditorHistory.prototype.undoneOverlaysPush = function () { 
     325     
     326    var conditionUndone = this.presentOverlays[this.presentOverlays.length - 1] !== undefined; 
    291327 
    292328    if (conditionUndone) { 
    293         let overlays_copy = []; 
    294         for (var i = 0; i < presentOverlays[0].length; i++) { 
    295             var clone_shape = cloneShape(presentOverlays[0][i]); 
    296             if (overlayItemIsShape(clone_shape)) { 
    297                 addShapeListeners(clone_shape, null); // don't have an overlay event! 
    298             } else { 
    299                 addMarkerListeners(clone_shape, null); // don't have an overlay event! 
    300             } 
    301             overlays_copy[i] = clone_shape; 
    302         } 
    303         undoneOverlays.push(overlays_copy); 
    304     } 
    305  
    306     var conditionPresent = prevOverlays[prevOverlays.length - 1] !== undefined; 
    307  
    308     if (conditionPresent) { 
    309         presentOverlays = []; 
    310         var overlays_copy = []; 
    311         for (var i = 0; i < prevOverlays[prevOverlays.length - 1].length; i++) { 
    312             let clone_shape = cloneShape(prevOverlays[prevOverlays.length - 1][i]); 
    313             if (overlayItemIsShape(clone_shape)) { 
    314                 addShapeListeners(clone_shape, null); // don't have an overlay event! 
    315             } else { 
    316                 addMarkerListeners(clone_shape, null); // don't have an overlay event! 
    317             } 
    318             overlays_copy[i] = clone_shape; 
    319         } 
    320         presentOverlays.push(overlays_copy); 
    321     } 
    322 } 
    323  
    324  
    325 MapEditorHistory.prototype.undoneOverlaysPush = function() { 
    326  
    327     let conditionUndone = this.presentOverlays[this.presentOverlays.length - 1] !== undefined; 
    328  
    329     if (conditionUndone) { 
    330329        var overlays_copy = []; 
    331330        for (var i = 0; i < this.presentOverlays[0].length; i++) { 
    332             let clone_shape = this.cloneShape(this.presentOverlays[0][i]); 
    333             if (this.overlayItemIsShape(clone_shape)) { 
    334                 addShapeListeners(clone_shape, null); // don't have an overlay event! 
    335             } else { 
    336                 addMarkerListeners(clone_shape, null); // don't have an overlay event! 
     331            var clone_shape = ShapesUtil.cloneShape(this.presentOverlays[0][i]); 
     332            if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     333                this.mapEditor.addShapeListeners(clone_shape, null); // don't have an overlay event! 
     334            } else { 
     335                this.mapEditor.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
    337336            } 
    338337            overlays_copy[i] = clone_shape; 
     
    341340    } 
    342341 
    343     let conditionPresent = this.prevOverlays[this.prevOverlays.length - 1] !== undefined; 
     342    var conditionPresent = this.prevOverlays[this.prevOverlays.length - 1] !== undefined; 
    344343 
    345344    if (conditionPresent) { 
    346345        this.presentOverlays = []; 
    347346        var overlays_copy = []; 
    348         for (let i = 0; i < this.prevOverlays[this.prevOverlays.length - 1].length; i++) { 
    349             var clone_shape = this.cloneShape(this.prevOverlays[this.prevOverlays.length - 1][i]); 
    350             if (this.overlayItemIsShape(clone_shape)) { 
    351                 addShapeListeners(clone_shape, null); // don't have an overlay event! 
    352             } else { 
    353                 addMarkerListeners(clone_shape, null); // don't have an overlay event! 
     347        for (var i = 0; i < this.prevOverlays[this.prevOverlays.length - 1].length; i++) { 
     348            var clone_shape = cloneShape(this.prevOverlays[this.prevOverlays.length - 1][i]); 
     349            if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     350                this.mapEditor.addShapeListeners(clone_shape, null); // don't have an overlay event! 
     351            } else { 
     352                this.mapEditor.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
    354353            } 
    355354            overlays_copy[i] = clone_shape; 
     
    359358} 
    360359 
     360MapEditorHistory.prototype.undoneOverlaysPush = function () { 
     361 
     362    var conditionUndone = this.presentOverlays[this.presentOverlays.length - 1] !== undefined; 
     363 
     364    if (conditionUndone) { 
     365        var overlays_copy = []; 
     366        for (var i = 0; i < this.presentOverlays[0].length; i++) { 
     367            var clone_shape = ShapesUtil.cloneShape(this.presentOverlays[0][i]); 
     368            if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     369                this.mapEditor.addShapeListeners(clone_shape, null); // don't have an overlay event! 
     370            } else { 
     371                this.mapEditor.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
     372            } 
     373            overlays_copy[i] = clone_shape; 
     374        } 
     375        this.undoneOverlays.push(overlays_copy); 
     376    } 
     377 
     378    var conditionPresent = this.prevOverlays[this.prevOverlays.length - 1] !== undefined; 
     379 
     380    if (conditionPresent) { 
     381        this.presentOverlays = []; 
     382        var overlays_copy = []; 
     383        for (var i = 0; i < this.prevOverlays[this.prevOverlays.length - 1].length; i++) { 
     384            var clone_shape = ShapesUtil.cloneShape(this.prevOverlays[this.prevOverlays.length - 1][i]); 
     385            if (ShapesUtil.overlayItemIsShape(clone_shape)) { 
     386                this.mapEditor.addShapeListeners(clone_shape, null); // don't have an overlay event! 
     387            } else { 
     388                this.mapEditor.addMarkerListeners(clone_shape, null); // don't have an overlay event! 
     389            } 
     390            overlays_copy[i] = clone_shape; 
     391        } 
     392        this.presentOverlays.push(overlays_copy); 
     393    } 
     394}