Changeset 33186 for main/trunk

Timestamp:

2019-06-21T22:26:57+12:00 (5 years ago)

Author:

wy59

Message:

Lower opacity for other documents that are nearby. Discovered broken code: Locations classifier in ImagesGPS no longer displays a map.

Location:

main/trunk/greenstone3/web/interfaces/default/js

Files:

• map-scripts-shapes-util.js (modified) (1 diff)
• map-scripts.js (modified) (12 diffs)

main/trunk/greenstone3/web/interfaces/default/js/map-scripts-shapes-util.js

@@ -580 +580 @@
 }
 
+
+ShapesUtil.setOpacity = function (shape, opacity) {
+    if (shape.type === google.maps.drawing.OverlayType.RECTANGLE
+        || shape.type === google.maps.drawing.OverlayType.POLYGON
+        || shape.type === google.maps.drawing.OverlayType.CIRCLE)
+    {
+        shape.fillOpacity = opacity;
+    } else if (shape.type === google.maps.drawing.OverlayType.POLYLINE) {
+        shape.strokeOpacity = opacity;
+    }
+    else {
+        console.log("Can't set opacity on unrecognised shape: " + shape.type);      
+    }
+}

main/trunk/greenstone3/web/interfaces/default/js/map-scripts.js

@@ -18 +18 @@
 var _scrollThroughDefault = true; // TODO: default starts at true
 
+var LOW_OPACITY = 0.1; // make surrounding docs' opacity 10%
+
 function initializeMapScripts() 
 {   
@@ -34 +36 @@
             {
                 _docList[jsonNodes[i].nodeID] = jsonNodes[i];
-                _docList.ids.push(jsonNodes[i].nodeID);             
-                createMarkers(jsonNodes[i], true);
-            }
+                _docList.ids.push(jsonNodes[i].nodeID);
+                var options = {
+                    "mainDoc": true
+                };
+                console.log("#### " + jsonNodes[i].nodeID + " is a main doc: ");
+                console.log(jsonNodes[i]);
+                createMarkers(jsonNodes[i], options);
+            }
+            
             updateMap();
         }
@@ -262 +270 @@
     {
         //console.log("*** responseText (first 250) = " + responseText.substring(0,256));
+        
+        // The first time, docList.ids contains ONLY the main/visible doc's ID and its subsections' IDs.
+        // Any one of these will do to determine
+        if(_docList.ids.length > 0) {
+            var mainDocID = _docList.ids[0];
+            var endIndex = mainDocID.indexOf('.');
+            if(endIndex == -1) { endIndex = mainDocID.length; }
+            mainDocID = mainDocID.substring(0, endIndex);
+        }
         
         if(responseText.search("id=\"jsonNodes") != -1)
@@ -279 +296 @@
                     
                     var found = false;
-                    for(var j = 0; j < _docList.ids.length; j++){if(doc.nodeID == _docList.ids[j]){found = true; break;}}
+                    for(var j = 0; j < _docList.ids.length; j++) {
+                        if(doc.nodeID == _docList.ids[j]) {
+                            found = true;                           
+                            console.log("Found nearby ID " + doc.nodeID + " was already drawn:");
+                            console.log(jsonNodes[i]);
+                            break;
+                        }
+                    }
                     
                     if(!found)
@@ -286 +310 @@
                         _docList.ids.push(doc.nodeID);
 
-                        createMarkers(doc, false);
+                        // Some "nearby docs" are actually subsections of the main document, which are retrieved
+                        // as a nearby doc by performSearchForMarkers() BEFORE the subsection is ever expanded.
+                        // We need to distinguish between subsections of the main doc -- which should be displayed
+                        // in their specified opacity -- and other docs and their subsections which should be displayed
+                        // faded out.
+                        if(typeof(mainDocID) !== 'undefined' && doc.nodeID.includes(mainDocID)) {
+                            createMarkers(doc, {"mainDoc": true});
+                        } else {
+                            createMarkers(doc, {"mainDoc": false});
+                        }                       
                     }
+                    
                 }
             }
@@ -548 +582 @@
 }
 
-function createMarkers(doc, mainMarker) {   
+function createMarkers(doc, options) {
     if(doc.mapoverlay) {
         //console.log("Have shapes: " + doc.mapoverlay.toString());
-        createShapes(doc, mainMarker);
+        createShapes(doc, options);
     } else { // backwards compatible to deal with Lat and Lng meta stored for doc
         pos = new google.maps.LatLng(doc.lat,doc.lng);
-        createMarker(doc, pos, mainMarker);
+        createMarker(doc, pos, options);
     }
 }
@@ -604 +638 @@
 // This function will create Google Shapes/Overlays and markers out of a given doc JSONNode's doc.mapOverlay
 // (doc.mapOverlay shapes are stored as an array of JSON) and store the shapes/overlays in the doc.shapes array.
-// Param mainMarker: if set to true, marker is red. If false, marker is blue
-function createShapes(doc, mainMarker)
+function createShapes(doc, options)
 {   
+    var isMainDoc = options["mainDoc"];
+
     // for doc.shapes: don't store JSON anymore, convert them to google Shapes overlays and store them instead
     doc.shapes = [];
@@ -624 +659 @@
         if(shape.type === google.maps.drawing.OverlayType.MARKER) {
             var marker = shape;
-            // mainMarkers should be red
-            if(!mainMarker) {
+            // markers of the main document should be red, else they'll be blue
+            if(!isMainDoc) {
                 marker["icon"] = "interfaces/" + gs.xsltParams.interface_name + "/images/bluemarker.png";
             }
@@ -638 +673 @@
         } else {            
             //console.log("Creating non-marker shape.");
+            
+            if(!isMainDoc) {
+                ShapesUtil.setOpacity(shape, LOW_OPACITY);
+            } // else the shape will be drawn at its configured opacity
         }
         
@@ -643 +682 @@
         shape.draggable = false;
         
-        console.log("#### calling addInfoMarker");
+        
         // doc[i]'s label = doc.shapes[i].description
         addInfoMarker(doc, shape);
@@ -669 +708 @@
 // This method is only for backwards compatibility: for those collections with docs that only have Lat and Lng meta
 // and no GPS.mapOverlay (and hence Coordinate) meta.
-// Param mainMarker: if set to true, marker is red. If false, marker is blue
-function createMarker(doc, pos, mainMarker)
-{
+function createMarker(doc, pos, options)
+{   
+    var isMainMarker = options["mainDoc"];
+    
     var marker;
-    if(mainMarker)
+    if(isMainMarker)
     {
         marker = new google.maps.Marker
@@ -750 +790 @@
                 _docList[doc.nodeID] = doc;
                 _docList.ids.push(doc.nodeID);
-
-                createMarkers(doc, true);
+    
+                var options = {
+                    "mainDoc": true // TODO: should this be true or false???
+                };
+                createMarkers(doc, options);
             }