Merge pull request #2607 from plotly/download_config

Override toImage modebar button opts via config

Author: nicolaskruchten

src/components/modebar/buttons.js

@@ -47,19 +47,32 @@ var modeBarButtons = module.exports = {};
 
 modeBarButtons.toImage = {
     name: 'toImage',
-    title: function(gd) { return _(gd, 'Download plot as a png'); },
+    title: function(gd) {
+        var opts = gd._context.toImageButtonOptions || {};
+        var format = opts.format || 'png';
+        return format === 'png' ?
+            _(gd, 'Download plot as a png') : // legacy text
+            _(gd, 'Download plot'); // generic non-PNG text
+    },
     icon: Icons.camera,
     click: function(gd) {
-        var format = 'png';
+        var toImageButtonOptions = gd._context.toImageButtonOptions;
+        var opts = {format: toImageButtonOptions.format || 'png'};
 
         Lib.notifier(_(gd, 'Taking snapshot - this may take a few seconds'), 'long');
 
-        if(Lib.isIE()) {
+        if(opts.format !== 'svg' && Lib.isIE()) {
             Lib.notifier(_(gd, 'IE only supports svg.  Changing format to svg.'), 'long');
-            format = 'svg';
+            opts.format = 'svg';
         }
 
-        Registry.call('downloadImage', gd, {'format': format})
+        ['filename', 'width', 'height', 'scale'].forEach(function(key) {
+            if(toImageButtonOptions[key]) {
+                opts[key] = toImageButtonOptions[key];
+            }
+        });
+
+        Registry.call('downloadImage', gd, opts)
           .then(function(filename) {
               Lib.notifier(_(gd, 'Snapshot succeeded') + ' - ' + filename, 'long');
           })

src/plot_api/plot_config.js

@@ -115,6 +115,11 @@ module.exports = {
      */
     modeBarButtons: false,
 
+    // statically override options for toImage modebar button
+    // allowed keys are format, filename, width, height, scale
+    // see ./components/modebar/buttons.js
+    toImageButtonOptions: {},
+
     // add the plotly logo on the end of the mode bar
     displaylogo: true,
 

test/jasmine/tests/modebar_test.js

@@ -5,6 +5,7 @@ var manageModeBar = require('@src/components/modebar/manage');
 
 var Plotly = require('@lib/index');
 var Plots = require('@src/plots/plots');
+var Registry = require('@src/registry');
 var createGraphDiv = require('../assets/create_graph_div');
 var destroyGraphDiv = require('../assets/destroy_graph_div');
 var selectButton = require('../assets/modebar_button');
@@ -767,6 +768,42 @@ describe('ModeBar', function() {
             }
         }
 
+        describe('toImage handlers', function() {
+            beforeEach(function() {
+                spyOn(Registry, 'call').and.callFake(function() {
+                    return Promise.resolve();
+                });
+                gd = createGraphDiv();
+            });
+
+            it('should use defaults', function(done) {
+                Plotly.plot(gd, {data: [], layout: {}})
+                .then(function() {
+                    selectButton(gd._fullLayout._modeBar, 'toImage').click();
+                    expect(Registry.call).toHaveBeenCalledWith('downloadImage', gd,
+                        {format: 'png'});
+                    done();
+                });
+            });
+
+            it('should accept overriding defaults', function(done) {
+                Plotly.plot(gd, {data: [], layout: {}, config: {
+                    toImageButtonOptions: {
+                        format: 'svg',
+                        filename: 'x',
+                        unsupported: 'should not pass'
+                    }
+                } })
+                .then(function() {
+                    selectButton(gd._fullLayout._modeBar, 'toImage').click();
+                    expect(Registry.call).toHaveBeenCalledWith('downloadImage', gd,
+                        {format: 'svg', filename: 'x'});
+                    done();
+                });
+            });
+
+        });
+
         describe('cartesian handlers', function() {
 
             beforeEach(function(done) {