diff --git a/src/components/modebar/buttons.js b/src/components/modebar/buttons.js index 97496258eaa..22875894d53 100644 --- a/src/components/modebar/buttons.js +++ b/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'); }) diff --git a/src/plot_api/plot_config.js b/src/plot_api/plot_config.js index 46db3bc0c1d..7971cd2ef8d 100644 --- a/src/plot_api/plot_config.js +++ b/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, diff --git a/test/jasmine/tests/modebar_test.js b/test/jasmine/tests/modebar_test.js index 718a4aefc14..8912205fe11 100644 --- a/test/jasmine/tests/modebar_test.js +++ b/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) {