Changeset 32799


Ignore:
Timestamp:
2019-02-22T11:22:03+13:00 (5 years ago)
Author:
ak19
Message:

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

File:
1 edited

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}
Note: See TracChangeset for help on using the changeset viewer.