remove takeScreenshot button in favour of separate buttons in the map card and import/export dialogue (#1086)

app/assets/stylesheets/clean.css.erb

@@ -455,19 +455,6 @@
     z-index: 4;
 }
 
-.takeScreenshot {
-    margin-bottom: 5px;
-    border-radius: 2px;
-    background-image: url(<%= asset_path 'screenshot_sprite.png' %>);
-    display: none;
-}
-.takeScreenshot:hover {
-    background-position: -32px 0;
-}
-.canEditMap .takeScreenshot {
-    display: block;
-}
-
 .zoomExtents {
     margin-bottom:5px;
     border-radius: 2px;
@@ -478,7 +465,7 @@
     background-position: -32px 0;
 }
 
-.zoomExtents:hover .tooltips, .zoomIn:hover .tooltips, .zoomOut:hover .tooltips, .takeScreenshot:hover .tooltips, .sidebarFilterIcon:hover .tooltipsUnder, .sidebarForkIcon:hover .tooltipsUnder, .notificationsIcon:hover .tooltipsUnder, .addMap:hover .tooltipsUnder, .authenticated .sidebarAccountIcon:hover .tooltipsUnder,
+.zoomExtents:hover .tooltips, .zoomIn:hover .tooltips, .zoomOut:hover .tooltips, .sidebarFilterIcon:hover .tooltipsUnder, .sidebarForkIcon:hover .tooltipsUnder, .notificationsIcon:hover .tooltipsUnder, .addMap:hover .tooltipsUnder, .authenticated .sidebarAccountIcon:hover .tooltipsUnder,
  .mapInfoIcon:hover .tooltipsAbove, .openCheatsheet:hover .tooltipsAbove, .chat-button:hover .tooltips, .importDialog:hover .tooltipsUnder, .starMap:hover .tooltipsAbove, .openMetacodeSwitcher:hover .tooltipsAbove, .pinCarousel:not(.isPinned):hover .tooltipsAbove.helpPin, .pinCarousel.isPinned:hover .tooltipsAbove.helpUnpin  {
     display: block;
 }
@@ -609,7 +596,7 @@
     margin-top: 40px;
 }
 
-.zoomExtents div::after, .zoomIn div::after, .zoomOut div::after, .takeScreenshot div:after, .chat-button div.tooltips::after {
+.zoomExtents div::after, .zoomIn div::after, .zoomOut div::after, .chat-button div.tooltips::after {
     content: '';
     position: absolute;
     top: 57%;

app/views/layouts/_lowermapelements.html.erb

@@ -1,5 +1,4 @@
 <div class="mapControls mapElement">
-	<div class="takeScreenshot mapControl"><div class="tooltips">Capture Screenshot</div></div>
 	<div class="zoomExtents mapControl"><div class="tooltips">Center View</div></div>
 	<div class="zoomIn mapControl"><div class="tooltips">Zoom In</div></div>
 	<div class="zoomOut mapControl"><div class="tooltips">Zoom Out</div></div>

frontend/src/Metamaps/JIT.js

@@ -59,8 +59,6 @@ const JIT = {
     }
     $('.zoomExtents').click(zoomExtents)
 
-    $('.takeScreenshot').click(Map.exportImage)
-
     self.topicDescImage = new Image()
     self.topicDescImage.src = serverData['topic_description_signifier.png']
 

frontend/src/Metamaps/Map/index.js

@@ -253,11 +253,6 @@ const Map = {
       DataModel.Mappers.add(Active.Mapper)
     }
   },
-  exportImage: function() {
-    Map.uploadMapScreenshot()
-    Map.offerScreenshotDownload()
-    GlobalUI.notifyUser('Note: this button is going away. Check the map card or the import box for setting the map thumbnail or downloading a screenshot.')
-  },
   offerScreenshotDownload: () => {
     const canvas = Map.getMapCanvasForScreenshots()
     const filename = Map.getMapScreenshotFilename(Active.Map)