Add permissions write permissions confirmation.

packages/mindplot/src/components/Designer.ts

@@ -57,6 +57,7 @@ import WidgetManager from './WidgetManager';
 import { TopicShapeType } from './model/INodeModel';
 import { LineType } from './ConnectionLine';
 import XMLSerializerFactory from './persistence/XMLSerializerFactory';
+import ImageExpoterFactory from './export/ImageExporterFactory';
 
 class Designer extends Events {
   private _mindmap: Mindmap | null;
@@ -378,51 +379,63 @@ class Designer extends Events {
   }
 
   async copyToClipboard(): Promise<void> {
+    const enableImageSupport = true;
     let topics = this.getModel().filterSelectedTopics();
-    if (topics.length > 0) {
-      const mindmap = new Mindmap();
-      const central: NodeModel = new NodeModel('CentralTopic', mindmap);
-      mindmap.addBranch(central);
 
-      // Exclude central topic ..
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      topics = topics.filter((topic) => !topic.isCentralTopic());
+    // @ts-ignore - Permissions is not defined on PermissionsName.
-      topics.forEach((topic) => {
+    const permissions = await navigator.permissions.query({ name: 'clipboard-write' });
-        const nodeModel: NodeModel = topic.getModel().deepCopy();
+    if (permissions.state === 'granted' || permissions.state === 'prompt') {
-        nodeModel.connectTo(central);
+      // https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Interact_with_the_clipboard
-      });
+      if (topics.length > 0) {
+        const blobs = {};
+        const mindmap = new Mindmap();
+        const central: NodeModel = new NodeModel('CentralTopic', mindmap);
+        mindmap.addBranch(central);
 
-      // Create text blob ...
+        // Exclude central topic ..
-      const serializer = XMLSerializerFactory.createFromMindmap(mindmap);
+        topics = topics.filter((topic) => !topic.isCentralTopic());
-      const document = serializer.toXML(mindmap);
+        topics.forEach((topic) => {
-      const xmlStr: string = new XMLSerializer().serializeToString(document);
+          const nodeModel: NodeModel = topic.getModel().deepCopy();
-      const textPlainBlob = new Blob([xmlStr], { type: 'text/plain' });
+          nodeModel.connectTo(central);
+        });
 
-      // Create image blob ...
+        // Create text blob ...
-      // const workspace = designer.getWorkSpace();
+        const serializer = XMLSerializerFactory.createFromMindmap(mindmap);
-      // const svgElement = workspace.getSVGElement();
+        const document = serializer.toXML(mindmap);
-      // const size = { width: window.innerWidth, height: window.innerHeight };
+        const xmlStr: string = new XMLSerializer().serializeToString(document);
+        const textPlainBlob = new Blob([xmlStr], { type: 'text/plain' });
+        blobs[textPlainBlob.type] = textPlainBlob;
 
-      // const imageUrl = ImageExpoterFactory.create(
+        if (enableImageSupport) {
-      //   'png',
+          // Create image blob ...
-      //   svgElement,
+          const workspace = designer.getWorkSpace();
-      //   size.width,
+          const svgElement = workspace.getSVGElement();
-      //   size.height,
+          const size = { width: window.innerWidth, height: window.innerHeight };
-      //   false,
-      // );
-      // let imgStr = await imageUrl.exportAndEncode();
-      // imgStr = imgStr.replace('octet/stream', 'image/png');
-      // const imgBlob = await (await fetch(imgStr)).blob();
 
-      // Finally, add to clipboard ...
+          const imageUrl = ImageExpoterFactory.create(
-      const clipboard = new ClipboardItem({
+            'png',
-        [textPlainBlob.type]: textPlainBlob,
+            svgElement,
-        // [imgBlob.type]: imgBlob,
+            size.width,
-      });
+            size.height,
+            false,
+          );
+          let imgStr = await imageUrl.exportAndEncode();
+          imgStr = imgStr.replace('octet/stream', 'image/png');
+          const imgBlob = await (await fetch(imgStr)).blob();
+          blobs[imgBlob.type] = imgBlob;
+        }
 
-      navigator.clipboard.write([clipboard]).then(
+        // Finally, add to clipboard ...
-        () => console.log('Copy of node success'),
+        const clipboard = new ClipboardItem(blobs);
-        (e) => console.error(e),
+        navigator.clipboard.write([clipboard]).then(
-      );
+          () => console.log('Copy of node success'),
+          (e) => {
+            console.error('Unexpected error adding to clipboard');
+            console.error(e);
+          },
+        );
+      }
     }
   }
 

packages/webapp/public/manifest.json

@@ -1,25 +0,0 @@
-{
-    "short_name": "WiseMapping",
-    "name": "WiseMapping",
-    "icons": [{
-            "src": "favicon.ico",
-            "sizes": "64x64 32x32 24x24 16x16",
-            "type": "image/x-icon"
-        },
-        {
-            "src": "favicon.png",
-            "type": "image/png",
-            "sizes": "1024x1024"
-        }
-    ],
-    "permissions" : [
-        "https://*/*",
-        "clipboardRead",
-        "clipboardWrite",
-        "storage"
-    ],
-    "start_url": ".",
-    "display": "standalone",
-    "theme_color": "#000000",
-    "background_color": "#ffffff"
-}