Add Copy Image option

sindresorhus · Jul 3, 2019 · 75836cb · 75836cb
1 parent bf760be
commit 75836cb
Show file tree

Hide file tree

Showing 2 changed files with 63 additions and 46 deletions.
diff --git a/index.js b/index.js
@@ -83,6 +83,14 @@ const create = (win, options) => {
 					webContents(win).insertText(clipboardContent);
 				}
 			}),
+			copyImage: decorateMenuItem({
+				id: 'copyImage',
+				label: 'Copy Image',
+				visible: props.mediaType === 'image',
+				click() {
+					webContents(win).copyImageAt(props.x, props.y);
+				}
+			}),
 			saveImage: decorateMenuItem({
 				id: 'save',
 				label: 'Save Image',
@@ -157,6 +165,7 @@ const create = (win, options) => {
 			defaultActions.separator(),
 			defaultActions.saveImage(),
 			options.showSaveImageAs && defaultActions.saveImageAs(),
+			defaultActions.copyImage(),
 			options.showCopyImageAddress && defaultActions.copyImageAddress(),
 			defaultActions.separator(),
 			defaultActions.copyLink(),

diff --git a/readme.md b/readme.md
@@ -8,48 +8,49 @@ Electron doesn't have a built-in context menu. You're supposed to handle that yo
 
 You can use this module directly in both the main and renderer process.
 
-
 ## Install
 
 ```
 $ npm install electron-context-menu
 ```
 
-*Requires Electron 4 or later.*
-
+_Requires Electron 4 or later._
 
 ## Usage
 
 ```js
-const {app, BrowserWindow} = require('electron');
-const contextMenu = require('electron-context-menu');
+const { app, BrowserWindow } = require("electron");
+const contextMenu = require("electron-context-menu");
 
 contextMenu({
-	prepend: (defaultActions, params, browserWindow) => [
-		{
-			label: 'Rainbow',
-			// Only show it when right-clicking images
-			visible: params.mediaType === 'image'
-		},
-		{
-			label: 'Search Google for “{selection}”',
-			// Only show it when right-clicking text
-			visible: params.selectionText.trim().length > 0,
-			click: () => {
-				shell.openExternal(`https://google.com/search?q=${encodeURIComponent(params.selectionText)}`);
-			}
-		}
-	]
+  prepend: (defaultActions, params, browserWindow) => [
+    {
+      label: "Rainbow",
+      // Only show it when right-clicking images
+      visible: params.mediaType === "image"
+    },
+    {
+      label: "Search Google for “{selection}”",
+      // Only show it when right-clicking text
+      visible: params.selectionText.trim().length > 0,
+      click: () => {
+        shell.openExternal(
+          `https://google.com/search?q=${encodeURIComponent(
+            params.selectionText
+          )}`
+        );
+      }
+    }
+  ]
 });
 
 let mainWindow;
 (async () => {
-	await app.whenReady();
-	mainWindow = new BrowserWindow();
+  await app.whenReady();
+  mainWindow = new BrowserWindow();
 })();
 ```
 
-
 ## API
 
 ### contextMenu(options?)
@@ -93,6 +94,13 @@ Default: `true`
 
 Show the `Look Up {selection}` menu item when right-clicking text on macOS.
 
+#### showCopyImage
+
+Type: `boolean`<br>
+Default: `true`
+
+Show the `Copy Image` menu item when right-clicking on an image.
+
 #### showCopyImageAddress
 
 Type: `boolean`<br>
@@ -156,8 +164,8 @@ Example:
 
 ```js
 {
-	// Doesn't show the menu if the element is editable
-	shouldShowMenu: (event, params) => !params.isEditable
+  // Doesn't show the menu if the element is editable
+  shouldShowMenu: (event, params) => !params.isEditable;
 }
 ```
 
@@ -190,6 +198,7 @@ Default actions:
 - `paste`
 - `saveImage`
 - `saveImageAs`
+- `copyImage`
 - `copyImageAddress`
 - `copyLink`
 - `inspect`
@@ -199,30 +208,29 @@ Example:
 
 ```js
 {
-	menu: actions => [
-		actions.copyLink({
-			transform: content => `modified_link_${content}`
-		}),
-		actions.separator(),
-		{
-			label: 'Unicorn'
-		},
-		actions.separator(),
-		actions.copy({
-			transform: content => `modified_copy_${content}`
-		}),
-		{
-			label: 'Invisible',
-			visible: false
-		},
-		actions.paste({
-			transform: content => `modified_paste_${content}`
-		})
-	]
+  menu: actions => [
+    actions.copyLink({
+      transform: content => `modified_link_${content}`
+    }),
+    actions.separator(),
+    {
+      label: "Unicorn"
+    },
+    actions.separator(),
+    actions.copy({
+      transform: content => `modified_copy_${content}`
+    }),
+    {
+      label: "Invisible",
+      visible: false
+    },
+    actions.paste({
+      transform: content => `modified_paste_${content}`
+    })
+  ];
 }
 ```
 
-
 ## Related
 
 - [electron-util](https://github.com/sindresorhus/electron-util) - Useful utilities for developing Electron apps and modules