From 0ef60dce2d76667d22d2c56b5259ae6d834e9547 Mon Sep 17 00:00:00 2001 From: Lipis Date: Thu, 3 Dec 2020 12:03:29 +0200 Subject: [PATCH] More export events (#2441) --- analytics.md | 67 ++++++++++++++++++--------------- src/components/App.tsx | 1 + src/components/ExportDialog.tsx | 6 ++- src/data/index.ts | 5 +++ 4 files changed, 47 insertions(+), 32 deletions(-) diff --git a/analytics.md b/analytics.md index 264364dc..ba0b6241 100644 --- a/analytics.md +++ b/analytics.md @@ -1,31 +1,36 @@ -| Excalidraw | Name | Category | Label | Value | -| ------------------ | ------ | ---------------------------------- | ----------------------- | --------- | -| Shape / Selection | shape | selection, rectangle, diamond, etc | `toolbar` or `shortcut` | -| Lock selection | shape | lock | `on` or `off` | -| Load file | action | load | `MIME type` | -| Import from URL | action | import | -| Save | action | save | -| Save as | action | save as | -| Clear canvas | action | clear canvas | -| Zoom in | action | zoom | in | `zoom` | -| Zoom out | action | zoom | out | `zoom` | -| Zoom fit | action | zoom | fit | `zoom` | -| Zoom reset | action | zoom | reset | `zoom` | -| Open shortcut menu | action | keyboard shortcuts | -| Canvas color | change | canvas color | `color` | -| Background color | change | background color | `color` | -| Stroke color | change | stroke color | `color` | -| Stroke width | change | stroke | width | `width` | -| Stroke sloppiness | change | stroke | sloppiness | `value` | -| Fill | change | fill | `value` | -| Edge | change | edge | `value` | -| Opacity | change | opacity | value | `opacity` | -| Project name | change | title | -| Theme | change | theme | `light` or `dark` | -| Change language | change | language | `language` | -| Language on load | change | language on load | `language` | -| E2EE shield | exit | e2ee shield | -| GitHub corner | exit | github | -| Excalidraw blog | exit | blog | -| Excalidraw guides | exit | guides | -| File issues | exit | issues | +| Excalidraw | Name | Category | Label | Value | +| -------------------- | ------ | ---------------------------------- | ------------------------ | --------- | +| Shape / Selection | shape | selection, rectangle, diamond, etc | `toolbar` or `shortcut` | +| Text on double click | shape | text | `double-click` | +| Lock selection | shape | lock | `on` or `off` | +| Load file | action | load | `MIME type` | +| Import from URL | action | import | +| Save | action | save | +| Save as | action | save as | +| Clear canvas | action | clear canvas | +| Zoom in | action | zoom | in | `zoom` | +| Zoom out | action | zoom | out | `zoom` | +| Zoom fit | action | zoom | fit | `zoom` | +| Zoom reset | action | zoom | reset | `zoom` | +| Export dialog | action | export | dialog | +| Export to backend | action | export | backend | +| Export as SVG | action | export | `svg` or `clipboard-svg` | +| Export to PNG | action | export | `png` or `clipboard-png` | +| Open shortcut menu | action | keyboard shortcuts | +| Canvas color | change | canvas color | `color` | +| Background color | change | background color | `color` | +| Stroke color | change | stroke color | `color` | +| Stroke width | change | stroke | width | `width` | +| Stroke sloppiness | change | stroke | sloppiness | `value` | +| Fill | change | fill | `value` | +| Edge | change | edge | `value` | +| Opacity | change | opacity | value | `opacity` | +| Project name | change | title | +| Theme | change | theme | `light` or `dark` | +| Change language | change | language | `language` | +| Language on load | change | language on load | `language` | +| E2EE shield | exit | e2ee shield | +| GitHub corner | exit | github | +| Excalidraw blog | exit | blog | +| Excalidraw guides | exit | guides | +| File issues | exit | issues | diff --git a/src/components/App.tsx b/src/components/App.tsx index 2c6c7731..08222883 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -2029,6 +2029,7 @@ class App extends React.Component { resetCursor(); if (!event[KEYS.CTRL_OR_CMD]) { + trackEvent(EVENT_SHAPE, "text", "double-click"); this.startTextEditing({ sceneX, sceneY, diff --git a/src/components/ExportDialog.tsx b/src/components/ExportDialog.tsx index 7533e207..617d0f7c 100644 --- a/src/components/ExportDialog.tsx +++ b/src/components/ExportDialog.tsx @@ -18,6 +18,7 @@ import useIsMobile from "../is-mobile"; import { Dialog } from "./Dialog"; import { canvasToBlob } from "../data/blob"; import { CanvasError } from "../errors"; +import { EVENT_ACTION, trackEvent } from "../analytics"; const scales = [1, 2, 3]; const defaultScale = scales.includes(devicePixelRatio) ? devicePixelRatio : 1; @@ -250,7 +251,10 @@ export const ExportDialog = ({ return ( <> setModalIsShown(true)} + onClick={() => { + trackEvent(EVENT_ACTION, "export", "dialog"); + setModalIsShown(true); + }} icon={exportFile} type="button" aria-label={t("buttons.export")} diff --git a/src/data/index.ts b/src/data/index.ts index a8957936..257533fd 100644 --- a/src/data/index.ts +++ b/src/data/index.ts @@ -218,6 +218,7 @@ export const exportToBackend = async ( url.hash = `json=${json.id},${exportedKey.k!}`; const urlString = url.toString(); window.prompt(`🔒${t("alerts.uploadedSecurly")}`, urlString); + trackEvent(EVENT_ACTION, "export", "backend"); } else if (json.error_class === "RequestTooLargeError") { window.alert(t("alerts.couldNotCreateShareableLinkTooBig")); } else { @@ -321,8 +322,10 @@ export const exportCanvas = async ( fileName: `${name}.svg`, extensions: [".svg"], }); + trackEvent(EVENT_ACTION, "export", "svg"); return; } else if (type === "clipboard-svg") { + trackEvent(EVENT_ACTION, "export", "clipboard-svg"); copyTextToSystemClipboard(tempSvg.outerHTML); return; } @@ -354,9 +357,11 @@ export const exportCanvas = async ( fileName, extensions: [".png"], }); + trackEvent(EVENT_ACTION, "export", "png"); } else if (type === "clipboard") { try { await copyCanvasToClipboardAsPng(tempCanvas); + trackEvent(EVENT_ACTION, "export", "clipboard-png"); } catch (error) { if (error.name === "CANVAS_POSSIBLY_TOO_BIG") { throw error;